putImageData无法正常工作检查现有问题

Question

ctx.drawImage(preview,0,0, preview.width, preview.height)
var imgdata = ctx.getImageData(0,0, preview.width, preview.height).data;
ctx.putImageData(opaque(ctx.createImageData(10,10)), 0,0)

opaque函数将alpha数据设置为1.以便使10 * 10的黑色方块疼痛。

function opaque(imgData){
        for(var i=0, data = imgData.data; i<data.length; i=i+4){            
            data[i+3] = 1;
        }       
        return imgData;
    }

但我的画布看起来很白。

Answer 1

你想做什么？

如果要绘制黑色方块，请使用context.fillRect（...）。它比操纵imageData更有效。

如果要使imageData的部分完全透明，则需要将alpha通道设置为0. alpha通道的范围为[0..255]，零表示完全透明，255表示完全不透明。

虽然我实际上没有运行它，但是从读取不透明函数开始，它似乎只是使其imageData参数的像素几乎完全透明。