Canvas arcTo() メソッド
例
二つの切線の間に弧を描画する：
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.beginPath();
ctx.moveTo(20,20); // 始点を作成
ctx.lineTo(100,20); // 水平線を作成
ctx.arcTo(150,20,150,70,50); // 弧を作成
ctx.lineTo(150,120); // 垂直線を作成
ctx.stroke(); // 描画を行います
文法
context.fillRect(x1,y1,x2,y2,r);
パラメータの値
| パラメータ | 説明 |
|---|---|
| x1 | 弧の始点の x 座標 |
| y1 | 弧の始点の y 座標 |
| x2 | 弧の終点の x 座標 |
| y2 | 円の終点の y 座標 |
| r | 円の半径 |
ブラウザのサポート
表の数字は、その属性を完全にサポートする最初のブラウザバージョンを示しています。
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
注記：Internet Explorer 8 以前のバージョンでは <canvas> 要素をサポートしていません。
