画布上的PNG透明度

Question

帆布支持png alpha吗？我对我添加到画布中的一些PNG遇到了一些问题。图像的边缘是黑色和锯齿状的，好像没有α通道存在或被识别。

Answer 1

如果您在画布上放置了24位PNG，则可以理解它。

https://developer.mozilla.org/en-us/docs/web/guide/html/canvas_tutorial/using_images

也许您的PNG不干净，即边界有非透明区域？

Answer 2

利用 clearRect（） 或者 fillRect（） 在重新绘制PNG图像之前，如果您是在请求式框架或setInterval循环中进行的。

我偶然发现了这个问题，因为我遇到了类似的问题，但是我的图像已经在24位。有一个RequestAnimationFrame循环将PNG图像重新绘制到画布上，并且（正如您所说的）重叠时，结果是这种“燃烧的”边缘，它应该具有Alpha“ vade-out”透明度。

只需在呼叫抽奖之前清洁区域，就可以防止将该图像呈现在自身上。