Bug with gl.blendFunc?

In the webgl port of my engine, I’ve found that alpha textures brighten what is behind them. This is not the desired behavior and is different from what I’m getting in my OpenGL engine. I’m using…

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

Is this a known bug or am I possibly forgetting something else that would affect the render? The shader is very straight-forward…

I haven’t seen that bug - but one that’s related is that some browser versions incorrectly assign you a “destination alpha” buffer even though you didn’t ask for one. Also, “destination alpha” is only very rarely used in OpenGL and DirectX programs - yet it is the default for WebGL contexts.

So, two suggestions:

  1. When you create your context…use something like:

    var gl = canvas.getContext ( “experimental-webgl”,
    alpha : false ,
    antialias : true ,
    depth : true ,
    stencil : false ,
    premultipliedAlpha: false } ) ;

…note particularly “alpha:false”.

  1. To work-around the bug, if it’s still there, use this to clear the screen each frame:

    gl.colorMask ( 1,1,1,1 ) ; // Note the last ‘1’ enables writes to dest-alpha buffer.
    gl.clearColor ( r,g,b,1 ) ; // r,g,b can be whatever - but we’re setting alpha=1
    gl.colorMask ( 1,1,1,0 ) ; // Note the last ‘0’ disables writing to dest-alpha
    …render your scene…

If that’s not it - it’s possible you have some kind of weird premultiplied alpha issue with your textures.

The first suggestion worked. Thanks a lot! :slight_smile: