如何弄清楚，如果图像文件（base64）具有透明度？

Question

我想知道，我怎么能弄清楚图像是否应用了透明效果。在JavaScript或HTML5中有什么办法吗？我有一个Base64编码的图像。有没有办法读出透明度信息（alpha-channel）。例如，如果我加载PNG图像，然后将其转换为base64，然后将其放到html5-canvas，现在我怎么知道这是否激活了透明效果？ 非常感谢 okyo

Answer 1

当你说'把它放到html5-canvas'时，我假设你的意思是使用带有'data：'URI方案的图像元素。另外，让我们假设你不想编写javascript代码来解析图像文件。

你可以做类似这样的伪代码：

create 2 off-screen canvases
color one opaque white and the other opaque black
draw the image on both of them
call getImageData on each canvas, using the image bounds
compare the image data

如果图像有任何透明或部分透明的像素，那么可能两幅画布最终会有所不同。一个例外是如果图像启用了透明度功能但无论如何都是完全不透明的。另一种情况是，如果非不透明像素只是非常轻微透明 - 不足以改变白色或黑色背景。但是这种技术可以捕捉透明度明显的图像。