Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to stop OpenGL background bleed on transparent textures
    primarykey
    data
    text
    <p>I have an iOS OpenGL ES 2.0 3D game and am working to get transparent textures working nicely, in this particular example for a fence.</p> <p>I'll start with the final result. The bits of green background/clear color are coming through around the edges of the fence - note how it isn't ALL edges and some of it is ok:</p> <p><img src="https://i.stack.imgur.com/W12Pv.png" alt="Background bleed evidence"></p> <p>The reason for the lack of bleed in the top right is order of operations. As you can see from the following shots, the order of draw includes some buildings that get drawn BEFORE the fence. But most of it is after the fence:</p> <p><img src="https://i.stack.imgur.com/fDUes.png" alt="Draw progression with depth"></p> <p>So one solution is to always draw my transparent textured objects last. I would like to explore other solutions, as my pipeline might not always allow this. I'm looking for other suggestions to solve this problem without sorting my draws.</p> <p>This is likely a depth or blend function, but i've tried a ton of stuff and nothing seems to work (different blend functions, different discard alpha levels, different background colors, different texture settings).</p> <p>Here are some specifics of my implementation.</p> <p>In my frag shader I'm throwing out fragments that have transparency - this way they won't render to depth:</p> <pre><code>lowp vec4 texVal = texture2D(sTexture, texCoord); if(texVal.w &lt; 0.5) discard; </code></pre> <p>I'm using one giant PVR texture atlas with mipmapping - the texture itself SHOULD just have 0 or 1 for alpha, but something with the blending could be causing this:</p> <pre><code>glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); </code></pre> <p>I'm using the following blending when rendering:</p> <pre><code>glEnable(GL_BLEND); glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); </code></pre> <p>Any suggestions to fix this bleed would be great!</p> <p>EDIT - tried a different min filter for the texture as suggested in the comments, LINEAR/NEAREST, but same result. Note I have also tried NEAREST/NEAREST and no luck:</p> <p><img src="https://i.stack.imgur.com/OfbPK.png" alt="enter image description here"></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload