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

Question

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

Answer 1

确实可以做到。

您将必须 getImageData Canvas 上下文并在表示 RGBA channel 的 4 block 中循环遍历它，然后分别比较每个 channel 。

多个像素的 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/