transparency - WebGL透明黑

Question

我有一个奇怪的问题，我在尝试在 WebGL 中进行混合时无法弄清楚。黑色呈现为完全透明，所有带有灰色阴影的内容也呈现为半透明。我已经将它设置为使用 alpha channel 作为透明度的来源，并且在某些方面它可以工作，当更改 alpha 值时，每一个不是黑色/灰色的东西都会以不同的方式呈现。但即使我将 alpha 设置为 1，黑色仍然显示为透明。

这就是我启用透明度的方式:

this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE);
this.gl.enable(this.gl.BLEND);
this.gl.disable(this.gl.DEPTH_TEST);

以及着色器中执行透明度的部分:

   gl_FragColor = vec4(texColor.rgb * vLightWeight, texColor.a * uAlpha);

其中 texColor 是正在采样的纹理颜色，vLightWeight 是在顶点着色器中计算的阴影，而 uAlpha 是我用于透明度的制服。

Answer 1

我认为你应该有 gl.ONE_MINUS_SRC_ALPHA 而你目前有 gl.ONE。

  gl.blendFunc( gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA  );