Html5 Canvas 方法 isPointInPath 仅确定最后一个对象

一个例子here http://jsfiddle.net/sfsd6/2/.

var context=document.getElementById("canvas").getContext("2d");

//Red Box
context.beginPath();
context.fillStyle="Red";
context.rect(10,10,50,50);
context.fill();

//Pink circle
context.beginPath();
context.lineWidth="3";
context.fillStyle="Pink";
context.arc(250,250,50,0,Math.PI*2,false);
context.fill();
context.stroke();

context.font="1.2em Verdana";
context.fillStyle="Black";
context.fillText(context.isPointInPath(35,35),35,35);
context.fillText(context.isPointInPath(250,250),250,250);

如果您在没有 beginPath 的情况下写入所有检测到的对象。 如何识别画布上的对象或省略beginPath？

如果您想使用该功能，则需要在每次想要进行测试时重建路径（只是不要调用fill or stroke).

如果有很多对象并且速度很重要，我通常所做的是使用我自己的多边形点测试函数或我自己的空间数据结构。

请注意，画布只是一个位图，它不存储用于在其上绘制的命令。这就是为什么它无法在绘制形状后进行检查，而您只能测试当前路径。

一旦你打电话beginPath先前的路径几何图形将被丢弃，如果您调用，您所拥有的只是受影响的像素fill or stroke.

可能对于您的情况，检查画布像素的颜色可能有意义......