ゼロからわかる現代JavaScript

ここは、ふぇりあ１６歳が不定期に連載しているオンライン小説のページです。

VNIふぇりあ16歳へ

ゼロからわかる現代JavaScript

３３．円弧の描画。「canvas」

*最新のIE9が必要です。

前回と同じくcanvasについてです。

今度は円弧を描画してみましょう

・arc

rectメソッドは、引数に（始点Ｘ，始点Ｙ、　半径、　始点の角度、　終点の角度）

を必要とします。

始点の角度、終点の角度には単位ラジアンを使い指定します。

今回使用するソースコード

function main() {
　　//キャンバス要素の作成
　　var canvas = document.createElement("canvas");
　　//bodyに要素の追加
　　document.body.appendChild(canvas);

　　//コンテキストを取得 2dは2D描画の意味
　　var ctx = canvas.getContext("2d");

　　//円弧の終点の角度
　　var EANG = 270 * Math.PI/180;

　　//円弧を引く
　　ctx.arc(50, 50, 40, 0, EANG, false);

　　//実際に線を描く
　　ctx.stroke();
}

実行結果

コラム：

ラジアンに関しては高校の三角関数を勉強してください。
コンピュータープログラムの大半は
高校の数学でなんとかなる物がほとんどです。
だからこそ高校の勉強は大事なのです。