HTML5 キャンバス描画 help_html/css_WEB-ITnose-htmlチュートリアル-php.cn

HTML5 キャンバス描画 help_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

リリース： 2016-06-21 09:35:44

オリジナル

994 人が閲覧しました

<!doctype html><html lang="en"><head><meta charset=utf-8 /><title>绘制路径</title></head><body><canvas style=" background:#000;"></canvas><script>//绘制火柴人var canvas = document.querySelector('canvas'),	ctx = canvas.getContext('2d');//绘制头部ctx.beginPath();ctx.arc(100, 35, 25, 0, Math.PI*2, true);ctx.fillStyle = '#fff';ctx.fill();//绘制笑脸ctx.beginPath();ctx.strokeStyle = '#c00';ctx.lineWidth = 3;ctx.arc(100, 37, 15, 0, Math.PI, false);ctx.stroke();//绘制眼睛ctx.beginPath();ctx.fillStyle = '#c00';//绘制左眼ctx.arc(90, 30, 2, 0, Math.PI*2, true);ctx.fill();ctx.moveTo(113, 30);//绘制右眼ctx.arc(110, 30, 2, 0, Math.PI*2, true);ctx.fill();ctx.stroke();//绘制身体ctx.beginPath();ctx.fillStyle = '#fff';ctx.fillRect(98, 55, 3, 50);//绘制胳膊ctx.beginPath();//绘制左胳膊ctx.moveTo(70, 100);ctx.lineTo(100, 70);ctx.stroke();</script></body></html>

ログイン後にコピー

棒人間の頭と体を描きましたが、右腕を描く方法がまだ見つかりませんでした。腕を反転する方法を教えてください。ありがとうございます

ディスカッションへの返信 (解決策) )

rreee
こんな感じですか？

HTML コード

パス</ title> ; </head> <body> <script> <body> … はい、ほぼわかりました。ありがとう、ヒーロー。しかし、どうすれば 2 つの腕の色を変更できますか? HTML コード < ; !doctype html> <html lang="en"> <meta charset=utf-8 /> </head> <body> <canvas style="background:#000;"></canvas> //棒人間を描画します …… のメソッドをご覧ください。それ。。私の記憶が正しければ、 HTML コード <doctype html> <head> <meta charset=utf-8 /> があります。 title>パスを描画

著者別の最新記事