Texture Bleeding.

OpenGL Development
#1

I wrote about this topic once, but there was no nice solution. So I thought I might try again.

So the problem is that my textures bleed. I see pixels on my squares I should not. This happens once I use float precision instead of pixel precision for rendering stuff (stuff is put into float precision, not int).

If you didn’t get that I’m using atlas (i specify certain part of texture as my tex coordinates) so yea.

Is there a way to make like a “sub-texture” so it “limits” which pixels it can pick from texture? This is really annoying problem…

I could just switch back to int precision, but then stuff looks shit when scrolling.

Maybe I could do that in fragment shader when specifying color there or something?

#2

Tex coords are texel coords not pixel coords. Have you tried the half texel fix?

#3

When I typed “texel” it gave me spelling error, so I went with pixel.

I tried adding 1f / texture.width / 2 to all coordinates. Results were awful. :frowning:

#4

I believe you’re running into the texel offset problem.

Refer to this diagram:

If you added 0.5f to all your texel coords you should be able to map your texels back to your original pixel coordinates.

#5

Hm I “kinda” fixed the problem. Didn’t really see any bleeding after I put in this code. Basically texture corners.


			float pixel_width = 1f / sprite.sheet.width;
			float pixel_height = 1f / sprite.sheet.height;

			int i = 256;
			
			float x0 = (pixel_width) * sprite.width * sprite.x + pixel_width / i;
			float y0 = (pixel_height) * sprite.height * sprite.y + pixel_width / i;

			float x1 = (pixel_width) * sprite.width * (sprite.x + 1) - pixel_width / i;
			float y1 = (pixel_height) * sprite.height * (sprite.y + 1) - pixel_width / i;

If you put “i” to a low value, stuff gets stretched. If it is too high, bleeding appears. Kinda annoying.

#6

What min/mag filter are you using?

I use GL_NEAREST with the half texel fix fine.

#7

GL_NEAREST too. Also, i = 8; is perfectly enough. Could you copy/paste where you calculate texture corners? If it is not too messy. I’m going to sleep in a few mins btw.

#8 
            float inverseW = 1.0f / getAtlas().getWidth();
            float inverseH = 1.0f / getAtlas().getHeight();
            float newU = inverseW * region.x + 0.5f;
            float newV = inverseH * region.y + 0.5f;
            float newS = inverseW * (region.x + region.width) + 0.5f;
            float newT = inverseH * (region.y + region.height) + 0.5f;

Tried to tidy it up a bit for you, this isnt the original code I used but mathematically it is the same.

#9

Why are you adding 0.5f? That is like half of the texture.
Shoulnd’t it be + inverseW/2 and +inverseH/2 ?

#10

ok so I fixed the bleeding problem. Now I’m getting texture flickering because I’m moving on floats. Any ideas how to fix texture flickering without changing texture filter?