javascript - webgl 和 2d Canvas 之间的透明度差异

Question

我有一个 png，我使用 2d canvas 加载它，并将其作为 webgl 纹理。 png 有一些透明部分，在 webgl 中渲染为黑色，在 2d canvas 中渲染为白色。 (请参阅 this fiddle 进行现场演示。在 Chrome 中，您需要使用 --disable-web-security 标志运行以绕过跨源限制。)

有没有办法设置 webgl 纹理的透明度颜色？二维 Canvas 怎么样？

Answer 1

您在 createTexture 中将纹理加载为 RGB，因此丢弃了 Alpha channel 。将其更改为 RGBA，如下所示

gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);

它们看起来是一样的。