PNG Transparency on Canvas

畫布是否支持PNG alpha？我有一些問題，我已經添加到畫布上的一些PNG。圖像的邊緣是黑色的，鋸齒狀，好像沒有alpha通道存在或被識別。PNG Transparency on Canvas

2011-01-13 Rigil

看起來您可能正在保存具有1位透明度的8位PNG，因此它將與黑色混合。你能分享一個給你麻煩的文件嗎？ – Phrogz 2011-01-13 21:41:20

如果你在畫布上放置了一個帶有alpha的24位PNG，它可以理解它。

也許你的PNG格式是不乾淨的，即必須在邊界非透明區域？

2011-01-13 09:41:38 oberhamsi

忘了提及，我正在使用processing.js庫來顯示圖像。我只是看着文檔，並沒有提到PNG是支持的，所以我猜我的運氣不好。 – Rigil 2011-01-13 10:08:22

使用clearRect()或fillRect()重新繪製PNG圖像，如果您在requestAnimationFrame或setInterval循環中執行此操作。

我偶然發現了這個問題，因爲我有類似的問題，但我的圖像已經在24位。如果有一個requestAnimationFrame循環將PNG圖像重新繪製到畫布上，並且（如您所說）重疊時，結果是這個「燒焦」邊緣應該具有alpha「淡出」透明度。

只需在調用drawImage之前清理該區域，就可以防止該圖像自身被渲染。

2017-07-26 14:27:38 adrield

回答