Canvas arc() 方法
定義和用法
arc()
方法創建弧/曲線(用于創建圓或部分圓)。
提示:如需通過 arc() 來創建圓,請把起始角設置為 0
,結束角設置為 2*Math.PI
。
提示:請使用 stroke() 或 fill() 方法在畫布上繪制實際的弧。

- 中心:arc(
100
,75
,50,0*Math.PI,1.5*Math.PI) - 起始角:arc(100,75,50,
0
,1.5*Math.PI) - 結束角:arc(100,75,50,0*Math.PI,
1.5*Math.PI
)
實例
創建一個圓形:
JavaScript:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.beginPath(); ctx.arc(100,75,50,0,2*Math.PI); ctx.stroke();
語法
context.arc(x,y,r,sAngle,eAngle,counterclockwise);
參數值
參數 | 描述 |
---|---|
x | 圓的中心的 x 坐標。 |
y | 圓的中心的 y 坐標。 |
r | 圓的半徑。 |
sAngle | 起始角,以弧度計。(弧的圓形的三點鐘位置是 0 度)。 |
eAngle | 結束角,以弧度計。 |
counterclockwise | 可選。規定應該逆時針還是順時針繪圖。False = 順時針,true = 逆時針。 |
瀏覽器支持
表中的數字注明了首個完全支持該屬性的瀏覽器版本。
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
注釋:Internet Explorer 8 以及更早的版本不支持 <canvas> 元素。