HTML canvas arcTo() 方法

Canvas 對象參考手冊 Canvas 對象

實例

在畫布上創建介於兩個切線之間的弧:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.beginPath(); ctx.moveTo(20,20); // 創建開始點 ctx.lineTo(100,20); // 創建水平線 ctx.arcTo(150,20,150,70,50); // 創建弧 ctx.lineTo(150,120); // 創建垂直線 ctx.stroke(); // 繪製


流覽器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9、Firefox、Chrome 和 Safari 支持 arcTo() 方法。

注意:Opera 不支持 arcTo() 方法。

注意:Internet Explorer 8 及之前的版本不支持 <canvas> 元素。


定義和用法

arcTo() 方法在畫布上創建介於兩個切線之間的弧/曲線。

提示:請使用 stroke() 方法在畫布上繪製確切的弧。

JavaScript 語法: context.arcTo(x1,y1,x2,y2,r);

參數值

參數 描述
x1 弧的起點的 x 座標。
y1 弧的起點的 y 座標。
x2 弧的終點的 x 座標。
y2 弧的終點的 y 座標。
r 弧的半徑。


Canvas 對象參考手冊 Canvas 對象