HTML5 JavaScript中类似于Flash的BitmapData.hitTest()的等效方法是什么？

Question

3

我想知道在支持HTML5的浏览器中，是否存在与Flash相同的JavaScript方法来评估位图之间的hitTest。

此外，如何实现“模糊滤镜”？是否可以将现有的DIV / SPAN标签“绘制”（类似于Flash的BitmapData.draw（）方法）到位图对象中，以便在画布上用于“hitTest”目的？

我认为我可能对HTML5术语的理解有误，但希望这样说有些意义。

是否有内置方法可以检查位图是否在像素级别接触？

谢谢！

- chamberlainpi

我也愿意接受服务器端的解决方案，例如在服务器上运行一个可以执行BitmapData.hitTest的SWF文件...但是这样的东西存在吗？是否有一种轻量级的Flash Player运行时环境适用于服务器？ - chamberlainpi

考虑到 HTML 画布使用浮点数变换，当你将一个旋转、缩小的位图与一个不同旋转的偏移了0.25像素并非均匀缩放为非常宽的位图进行测试时，你会期望发生什么？ - Phrogz

我不确定你的评论（问题）如何适用于这个上下文。是修辞问题吗？抱歉，你的措辞有点超出我的理解范围。 - chamberlainpi

2个回答

1

- Robert

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Phrogz · Accepted Answer

不，HTML Canvas或Context中没有方法可以确定两个区域是否重叠。没有非透明像素的非正方形区域重叠测试，没有变换边界框重叠测试，甚至没有轴对齐边界框重叠测试。任何这样的命中测试都需要由您或跟踪单个位图的更高级别API完成。Canvas/Context是一个非保留的低级像素混合和绘图API。
不，您不能将HTML元素的呈现序列化为画布图像（除了使用drawImage()复制图像和/或画布）。这包括尝试捕获在半透明/透明画布下绘制的内容。如果允许这样做会存在安全问题，因此不允许。
- 但是，您可以通过使用getImageData()获取原始像素，然后操作像素值，然后使用putImageData()将修改后的像素推回到画布来“模糊”已经绘制到画布上的内容。