3

幅100、高さ100の正方形のキャンバスがあります。その正方形内に次のような円弧を描きます。

var canvas = document.getElementById('myCanvas');
var ctx    = canvas.getContext('2d');
ctx.clearRect(0,0,100,100) // clears "myCanvas" which is 100pixels by 100 pixels
ctx.beginPath();
ctx.arc( 50, 50, 30, 0, Math.PI*2/6 , false )
ctx.stroke();

問題は、キャンバスの左上隅を基準にして、描画された線の最初と最後の点のx / y座標を取得するにはどうすればよいですか？

4

1 に答える 1

4

出発点は自明(x + radius, y)です。終点は、単純な三角法によると、(x + radius*cos(angle), y + radius*sin(angle))です。この場合の開始点は、angleゼロに等しい、より一般的な終了点の特殊なケースであることに注意してください。明らかな理由から、これらの値も最も近い整数に丸める必要があります。

（これは、anticlockwise引数がfalseの場合にのみ適用され、すべての座標が左上から測定されると仮定しますanticlockwise。trueの場合、y座標の2番目のコンポーネントの符号を逆にします。座標が別のコーナーから測定される場合は、単純な演算を適用します。これを修正するために。また、これは実際の数学者にとっては完全に逆であることに注意してください。）

于 2010-09-08T20:43:08.140 に答える