Javascript 检查 canvas 上的透明图像是否被点击
Javascript check if transparent image on canvas has been clicked
我有一个 canvas，我画了一个透明的图像，并且具有类似多边形的形状。现在我需要检查该图像是否已被单击。
我有线
{
x:30,
y:20,
w:100,
h:100
}
我可以检查一个方框或圆圈是否点击，但如果它像多边形一样僵硬，是否有像素点击测试或凸算法（但我不想指定边）？
谢谢。
一种解决方案是使用辅助 canvas 实现像素检测以用作地图。
- 将你的形状绘制到场景中 canvas。
- 在第二个 canvas 上绘制准确的形状，但将颜色设置为 rgb(0,0,0)。
- 将该颜色作为参考存储在某种地图中以参考您的第一个 'shape'
例如
var pixelMap = {
'000' : 'rectangle 1',
'001' : 'rectangle 2'
};
每次给canvas画一个新的形状，rgb增加1。除非你有超过1670万个形状（256^3），否则这个方法应该足够了。
我有一个 canvas，我画了一个透明的图像，并且具有类似多边形的形状。现在我需要检查该图像是否已被单击。
我有线 { x:30, y:20, w:100, h:100 }
我可以检查一个方框或圆圈是否点击，但如果它像多边形一样僵硬，是否有像素点击测试或凸算法（但我不想指定边）？
谢谢。
一种解决方案是使用辅助 canvas 实现像素检测以用作地图。
- 将你的形状绘制到场景中 canvas。
- 在第二个 canvas 上绘制准确的形状，但将颜色设置为 rgb(0,0,0)。
- 将该颜色作为参考存储在某种地图中以参考您的第一个 'shape'
例如
var pixelMap = {
'000' : 'rectangle 1',
'001' : 'rectangle 2'
};
每次给canvas画一个新的形状，rgb增加1。除非你有超过1670万个形状（256^3），否则这个方法应该足够了。