構文は以下のとおり。
arc(x, y, radius, startAngle, endAngle, anticlockwise)
x,yが円の中心
radiusは半径
startAngleが開始角度。X軸方向が0度。
endAngleが終了角度。
anticlockwiseは方向（デフォルトは時計回り）
startAngleとendAngleに使う角度は「度」ではなくてラジアン。
度からラジアンに変換するには radians = 度数 ÷ 180 × Math.PIとする。
例えば30度なら、Math.PI/180*30で計算できる。
0度～360度までの円を描くには。360度はMath.PI/180*360なので2*Math.PIで表せる。ctx.fillで円の中を塗りつぶす。
See the Pen
canvas-circle1 by Takuma Endo (@pghappy)
on CodePen.
塗りつぶさない円を書くにはfillではなくてstrokeを使う。
See the Pen
Untitled by Takuma Endo (@pghappy)
on CodePen.
ピザのような円弧を書くには。
See the Pen
canvas-circle3 by Takuma Endo (@pghappy)
on CodePen.
まず円の中心にペンを持ってくる必要があるのでmoveToが必要。この行を消すと円弧の始点と終点を結んだだけの描画になっちゃう。
円の中心からの描画とすることでちゃんと扇のような形になってくれる。