使用 fillRect() 填充 canvas 并使用 4 个零获取每个像素 returns 数组的颜色

Question

说实话，我制作了两张画布，上面填充了部分JSFiddle logo。问题是每当我想用 getImageData().data 获取每个像素的颜色时，它 returns 一个空数组意味着像素是透明的，这是不正确的。问题代码：

for (i = 0; i < h; i+=scale)
    for (j = 0; j < w; j+=scale) {
        rgba1 = sctx.getImageData(i,j,1,1).data;
        rgba2 = sctx2.getImageData(i,j,1,1).data;
        // logging
        log('x:'+i/5+' | y:'+j/scale+' | '+rgba1);
        log('x:'+i/scale+' | y:'+j/scale+' | '+rgba2,true);
    }

打印结果：

代码有什么问题？ Fiddle here

Answer 1

仔细看看你的输出。您的 canvas 是横向模式，您的坐标表示纵向模式。

for (i = 0; i < w; i+=scale)
    for (j = 0; j < h; j+=scale) {

使用 fillRect() 填充 canvas 并使用 4 个零获取每个像素 returns 数组的颜色

Filling canvas with fillRect() and getting color of each pixel returns array with 4 zeros

javascript

canvas

getimagedata