Hi all,

I've not been programming with OpenGL for quite some time, I've taken a break, so forgive me if my question is very simple, but I've just been working on a little utility program for myself and I have a question.

If I have this image, saved as a .jpg...



That I wish to load and display at an angle in OpenGL, I get this...



...my question is whether there is an easy way I can get rid of the jagged black edges that form the border of the table. Obviously it is a black border against a white background, but I'm just curious what is possible.

I find it very interesting that the inner black lines in table (both horizontal and vertical) look very nice (smooth)... but the black single-line border is very jagged.

I was surprised this remained true if I didn't colour the grid in two shades of blue, but just had it in white, the inner black lines look smooth, but each border looks jagged - but all black lines in the image (whether on the inside or the border) are 1 pixel thick in the original image and are next to white pixels.

_________________
Cheers, DpM
http://www.hmusiccentre.org.uk

If, when I begin to load the texture, I deliberately intervene and extend the size of the image file being loaded (JPG or BMP) so that it becomes 2 pixels wider and higher, then fill the entire rectangle with white, before drawing the image at location 1,1 instead of 0,0, then I end up with a slightly larger image, but one that is the same as the image I want to load, except I've placed a single line white border around it, then I get this...

_________________
Cheers, DpM
http://www.hmusiccentre.org.uk

You could fix this alias problem by either using Anti-Aliasing (smoothing the edges of quads): http://www.opengl.org/wiki/Multisampling
Or you could do what you nearly already did. You add a small border around your image, which would look good even on a non-white background as long as the border is transparent. But you need to ensure that the texture has an alpha-channel to add transparency.

Method 1 (Anti-Aliasing via Multisampling) is definitely the more professional solution and will give nice results. On the other hand it's not that easy to include it and it costs much more performance.
Method 2 (The Alpha Border) is a simple and fast solution, but if you want to render a cube with such images as textures you will see that there are small gaps, where the edges should be.

On the whole, if you just want to render single quads, you can use method 2. Otherwise I see no way, but using method 1 to get nice and smooth results.

I have altered the texture loader for BMP and JPG files so that it puts a 2 pixel border around each image, the same as the current background that my utility has, and the results appear to be quite nice...



...good enough for me, anyway.

_________________
Cheers, DpM
http://www.hmusiccentre.org.uk

In the past I worked with bezier curves and distance field font rendering.
Both have the same problem like your's.

In DF Font rendering you abuse the fact that you use a atlas which need a border because of the color bleeding if you don't use one.
This is the solution you use at the moment and this is a very easy way because the trilinear filtering is much cheaper then force to use a AA render target.

Vector graphics can't use this because of the lack of a texture ^^
The solution here is to modify the shader and abuse the fact that no wrapping, clamp or repeat texture is neccessary.
All your mesh vertics will be scaled by the percentage which represent 2px of each side and then modify the UV's by the same factor.
The result is a little bigger mesh which have UV's between -0.x and 1.x.
The fragmentshader will fill the texels which lay in the fector graphic and blend the alpha channel by the positive or negative distance(depends on how you define inside or outside). The 2 extra texel you got through the UV's scaling allow you to blend off pixels which lay on 0.0 or 1.0.

You can also use the texture set with both wrap attributes set to clamp and scale the mesh and UV like before.
Instead of using a function to define the falloff the alpha channel it's the distance below 0.0 and above 1.0.
This will give you the same effect like the current one you use.
It's a question of trade off's, you can waste some pixels on the texture or spend some cycles on cpu and gpu to scale the vertices, uv and modify the alpha value on the shader.

_________________
"Wer die Freiheit aufgibt um Sicherheit zu gewinnen, der wird am Ende beides verlieren"
Benjamin Franklin

Projekte: https://github.com/tak2004