WebGL/three.js片段着色器 - 用alpha透明颜色覆盖alpha透明纹理

Question

因此，我将纹理传递给片段着色器，并且我希望在其上覆盖具有50％alpha的颜色。我有一半的工作，但原来的纹理失去了它的阿尔法。

请参见：

uniform sampler2D texture; 
varying vec2 vUv; 

void main() { 
    vec4 tColor = texture2D(texture, vUv); 

    vec4 color = vec4(1.0, 0.0, 0.0, 0.5); 
    gl_FragColor = vec4(mix(tColor.rgb, color.rgb, color.a), 1.0); 
} 

很明显这里，在gl_FragColor纹理的alpha不考虑，但我不知道如何整合它。

Answer 1

gl_FragColor = vec4(mix(tColor.rgb, color.rgb, color.a), 1.0); 

你正在传递，1.0最后一个参数是alpha，而你硬编码它到1