html - ImageData 对象检索指定颜色的 x,y 位置

Question

是否可以使用 ImageData 对象来检索 html5 画布上“黑色”的 x、y 像素位置？我对画布还很陌生，很难弄清楚这是否可行或如何实现。

Answer 1

确实你可以做到。

您将不得不getImageData使用画布上下文并在代表 RGBA 通道的 4 块中循环遍历它，然后分别比较每个通道。

多个像素的 ImageData 有点棘手。成像var imgData = ctx.getImageData(0, 0, width, height);：

现在imgData.data是一个大数组，格式如下：

imgData.data[0] // is the Red channel of the first pixel
imgData.data[1] // is the Green channel of the first pixel
imgData.data[2] // is the Blue channel of the first pixel
imgData.data[3] // is the Alpha (transparency) channel of the first pixel

imgData.data[4] // is the Red channel of the second pixel
... etc ...

检查你问的演示http://jsfiddle.net/GXrd5/