javascript - HTML5 Canvas ImageData rgb 值不正确

Question

我正在为绘图应用程序开发油漆桶工具。

我context.getImageData用来找出画布中所有像素的颜色值。

但是，默认情况下所有 rgba 值似乎都是 0，即使默认情况下画布是白色的。现在我的油漆桶工具不适用于黑色轮廓的形状，因为黑色具有 rgb0,0,0并且默认画布图像数据也可以，即使画布是白色的。

所以我的问题是我是否可以更改默认图像数据，使其反映画布的实际默认颜色（白色，或，255,255,255），或者如何快速将画布清除为该颜色。我认为一种可行但效率极低的解决方案是，在清除画布时，将每个像素的值设置为 255。但是，由于画布的大小，这会在执行时导致几秒钟的延迟。

还有其他我忽略的选择吗？谢谢。

Answer 1

一个空的画布被初始化为rgba(0,0,0,0)（即透明的）

如果您希望将所有内容初始化为白色，请运行类似这样的操作。

ctx.fillStyle = '#FFFFFF'; // or 'rgba(255,255,255,1)'
ctx.fillRect(0,0,canvas.width, canvas.height);

作为规范中的参考，它说：

初始化画布时，必须将其位图清除为透明黑色。