Question

我正在尝试将具有粗糙纹理的四边形组成的画笔笔划绘制到帧缓冲区中，然后将它们合成在一起。问题是帧缓冲纹理的初始颜色是0,0,0,0并且它混合在边缘周围创建一个黑暗的光晕。 here is an example image

我正在使用

gl.blendEquationSeparate( gl.FUNC_ADD, gl.FUNC_ADD );
gl.blendFuncSeparate( gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.SRC_ALPHA, gl.ONE );

我认为Iv尝试了混合设置的所有可能组合，但没有按照我想要的方式工作。

Answer 1

这看起来像是一个预乘法问题。您的画笔描边纹理不是预先倍增的，它们应该是，或者它们是预乘的，它们不应该是 - 我忘了它。

Answer 2

对于合成，你很可能想要使用预乘的alpha来获得你想要的效果。在上传数据时预先乘以纹理

gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);

或在着色器中预乘

gl_FragColor = vec4(color.rgb * color.a, color.a);

与

融为一体

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