如何获取画布上下文的框尺寸？

Question

我刚开始使用HTML中的canvas元素。

我遇到了障碍，我在路径上覆盖了一个图像。当有人点击路径时，我可以使用 isPointInPath 方法来了解已点击的路径。

问题是我想重新绘制缩放到路径外边框的图像，但我看不到检索该信息的方法。

ctx.beginPath();
ctx.arc(can.width / 2, can.height / 2, can.height / 2.5, ((2 * Math.PI) / 10) * 7, (2 * Math.PI) / 10);
ctx.lineTo(can.width / 2, can.height / 2);
ctx.closePath();

在这个小提琴http://jsfiddle.net/JohnSReid/78PEX/中，我画了一个圆弧。如果我使用上面代码中绘制的点，那么我将裁剪弧的外部点。

有没有办法抓住弧正在使用的区域的尺寸？

Answer 1

演示：http://jsfiddle.net/m1erickson/9xgwY/

你可以在圆圈（或圆弧）的圆周上得到任何一点：

function XYonCircle(cx,cy,radius,radians){
    var x=cx+radius*Math.cos(radians);
    var y=cy+radius*Math.sin(radians);
    return({x:x,y:y});
}

获取弧线的边界框：

var cw=canvas.width;
var ch=canvas.height;
var PI2=Math.PI*2;

var left=XYonCircle(cw/2,ch/2,ch/2.5,PI2/10*7).x;
var top=XYonCircle(cw/2,ch/2,ch/2.5,PI2*.75).y;
var right=XYonCircle(cw/2,ch/2,ch/2.5,0).x;
var bottom=XYonCircle(cw/2,ch/2,ch/2.5,PI2/10).y;

如果改变弧线，一些边界点将处于弧穿过的任何角度：0，PI / 2，PI＆amp; PI * 3/2。

其余的边界点将位于弧的起点和终点。