能否创建透明画布？

Question

我正在使用processing.js开发一个javascript画笔应用程序，它使用canvas对象。我想在canvas的背景上保留一张图像，然后在前景中绘制一些东西。当保存时，我只需要获取前景数据。

为此，我们需要使canvas对象透明，以便背景图像可见。

我没有看到任何可以使canvas透明的选项。我该怎么做？

- Soft

---

正确答案是 Jared 的。为什么？因为原帖作者说他需要使用 ProcessingJS 来完成，该库默认情况下将所有 canvas 元素渲染为灰色背景。他想要重写这个默认行为。 - YOMorales

Answer 1

更好的做法是，在您的pjs文件顶部加入以下内容：

/* @pjs transparent=true; */

... 然后在你的绘制循环中：

background(0, 0, 0, 0);

看这里！

- Jared

---

使用ProcessingJS时的正确答案。它也解决了我的问题。 - YOMorales

Answer 2

<canvas>默认是透明的。

我已经制作了一个概念验证，可以在这里找到：

http://irae.pro.br/lab/canvas_pie_countdown/

已测试过IE6、IE7、IE8、Firefox 2、Firefox 3、Chrome和iPhone。

- Irae Carvalho

---

这在使用其他画布库/API时有效。请注意，原帖作者说他需要使用ProcessingJS完成，它将所有画布元素呈现为默认的灰色背景。他想要覆盖此默认行为。Jared的答案实际上是正确的。 - YOMorales

没问题。我也经常犯错误。 ;) - YOMorales

Answer 3

context.clearRect(0,0,width, height) 

只需这些就可以 =)

请记住，您可以在画布对象上使用CSS样式。

canvas.style.position = "absolute";  
canvas.style.left = the x position of the div you're going over +"px";  
canvas.style.top = the y position of the div you're going over + "px";

- Warty

Answer 4

为什么不把图像放在画布中，使你的笔画和填充透明呢？

- jshen