使用html5画布图像时如何去除背景颜色？

【问题标题】：How to strip background color when using html5 canvas image?使用html5画布图像时如何去除背景颜色？
【发布时间】：2011-09-22 12:10:31
【问题描述】：

如果画布可以从加载（drawimage）到此画布中的外部图像中去除背景颜色？

我认为画布可以操纵像素，所以它应该去除图像背景颜色。经过一番搜索，我仍然找不到答案或任何想法。

【问题讨论】：

标签： image html canvas background-color

【解决方案1】：

在 a demo I wrote（个人垃圾邮件；）中，您可能需要一些东西：

full source 在这里

首先读取图像

brush.load({
imageUrl: "brush-2.png",
onload: function (brush) { 
    setBG(brush);
}

});

然后它操纵像素

for(p = 0; p < l; p = p + 4){
  r = pixels.data[p + 0];
  g = pixels.data[p + 1];
  b = pixels.data[p + 2];
  a = pixels.data[p + 3];

  pixels.data[p + 0] = k;
  pixels.data[p + 1] = m;
  pixels.data[p + 2] = o;
  pixels.data[p + 3] = a;

}

然后它从 imageData 设置图像

document.body.style.backgroundImage= "url(" + ctx.canvas.toDataURL() + ")";

more here

【讨论】：

太棒了！从您的网站学到很多东西。谢谢！