Mapping a texture on a 2D ground surface with opengl

Anything about development not directly related to libgdx, e.g. OpenGL, Android APIs etc.

Mapping a texture on a 2D ground surface with opengl

Postby sushisto » Thu Aug 11, 2016 9:46 pm

Hi everyone,

I have been using libgdx for some time and really enjoy it.

Right now, I'm trying to build the surface of a 2d ground with opengl (meshes, triangles, shaders and textures). I made my trapezoids/triangles following the gound "line", but when i attach the texture, it looks "broken" -> for each trapezoid, the texture orientation on the left triangle is following the left edge, and texture on the right triangle is following the right edge. So the result looks like a "broken" texture. What i would like is the texture orientation perpendicular to the top edge, on every trapezoid.

Image

I scrolled the web and read lots of stuff but couldn't find something that fit. What approach/reasoning/logic should i use to solve this and align my textures ?

Thanks,

Michel
sushisto
 
Posts: 5
Joined: Tue Mar 15, 2016 7:52 am

Re: Mapping a texture on a 2D ground surface with opengl

Postby tenfour04 » Fri Sep 23, 2016 1:46 pm

The easy solution here is to tesselate your mesh to reduce distortions.

The complicated solution is to multiply your UVs by the triangle width, and then divide the width out of your UVs in the fragment shader after the linear interpolation for the varyings has taken place. (Disclaimer: I haven't tried this, but I'm pretty sure it will improve what you've got. May not be perfect.)

So in your mesh, add a polygon side length vertex float attribute. You will not be able to do a triangle strip for this, because coincident vertices from different quads will have different side lengths. For all the top vertices, calculate the length of the top line they are next to and put that in the length attribute. And do the same for bottom vertices and bottom lines.

Then in the vertex shader, multiply UVs by the side length attribute. Also pass the side length as a varying. In the vertex shader, divide UV by the side length before passing it to the texture lookup.

This unfortunately results in a dependent texture read, but is probably acceptable.

Edit: actually, I think you can avoid the dependent texture read. Make your texture coordinate varying a vec4. Put the side length in the last position. Then use texture2DProj instead of texture2D:
Code: Select all
vec4 v_texCoord;

//...

v_texCoord.st = a_texCoord.st / a_sideLength;
v_texCoord.q = a_sideLength;

//Fragment shader:
vec4 texColor = texture2DProj(u_texture, v_texCoord);
tenfour04
 
Posts: 1192
Joined: Sat Jun 18, 2011 3:24 pm

Re: Mapping a texture on a 2D ground surface with opengl

Postby webcurse » Wed Jan 11, 2017 10:25 pm

Hi guys. I'm also fairly new to Libgdx/OpenGL and I'm trying to UV map my grass texture to a 2d ground as well (I already have the repeating mud texture for below the grass).

Can I just ask if this is the way to do it:
My fixture in Rube can be seen in the below pic. Am I right in thinking - I need to convert these polygon fixtures into one large mesh and supply the UV coordinates for each vertex. I'm struggling on how i would go about determining which vertex is at the top of the mesh versus which is a bottom vertex. Any pointers or websites I could use? All mesh tutorials seem to be really out of date, using GL 1.0.
Thanks!

http://imgur.com/vYNqxLDb (This forum's img formatting seems to produce a broken image)
webcurse
 
Posts: 4
Joined: Wed Jan 11, 2017 9:27 pm

Re: Mapping a texture on a 2D ground surface with opengl

Postby tenfour04 » Thu Jan 12, 2017 1:26 am

If you don't need the textures to align perpendicular to each of the top edges like the OP wanted, there's a much easier solution...the new RepeatablePolygonSprite class in version 1.9.5.
tenfour04
 
Posts: 1192
Joined: Sat Jun 18, 2011 3:24 pm

Re: Mapping a texture on a 2D ground surface with opengl

Postby webcurse » Fri Jan 13, 2017 11:11 pm

I will definitely use that class for my repeatable mud terrain to make use of a texture region instead of texture. However, I'm not sure entirely sure it would work with something like my grass terrain . When I create my grass terrain, the image is not rotated to fit the steeper inclines. The image appears to be only horizontal at all times. See these images for my grass terrain and mesh Image
Image
- The red lines are a very rough outline of my mesh. Any pointers would be much appreciated. Cheers

EDIT: I just realized you had the answer in your post tenfour - I do need a perpendicular image.lol
webcurse
 
Posts: 4
Joined: Wed Jan 11, 2017 9:27 pm

Re: Mapping a texture on a 2D ground surface with opengl

Postby sushisto » Sun Jan 15, 2017 6:10 pm

Hey guys,
I didn't follow the evolution of the post. After a month or so without answers i guessed it was done. But thanks tenfour04 for your answer, i wish i saw it before ! At the time, I found some work out and could finally build my ground and a surface : Image http://imgur.com/e2o03Yp. Texture for grounds and surface couldn't be included in my sprite atlas (not repeatbale). I think I'll now try that RepeatablePolygonSprite and see. Cheers.
sushisto
 
Posts: 5
Joined: Tue Mar 15, 2016 7:52 am

Re: Mapping a texture on a 2D ground surface with opengl

Postby Brayden256 » Mon Jan 07, 2019 6:27 am

At least i have found the solution. It includes 2 step :

1- My surface texture wraping was wrong. X axis must be repeated and Y axis must be clamped to edges. The correct one is:

Code: Select all
surfaceTexture.setWrap(Texture.TextureWrap.Repeat, Texture.TextureWrap.ClampToEdge);


2- When we use "ClampToEdge" wrapping, texture's Y coordinates must be between 0 and 1. So i have changed texture coordinates that i put as parameter to surface mesh. The correct one is:

Code: Select all
 tempVerSurface[offset+0] = x;      tempVerSurface[offset+1] = y- .02f;
        tempVerSurface[offset+2] = x;      tempVerSurface[offset+3] = 1f; // where i have changed

        tempVerSurface[offset+4] = x;      tempVerSurface[offset+5] = y+0.015f; 
        tempVerSurface[offset+6] = x;      tempVerSurface[offset+7] = 0;  // where i have changed.


So at now, my surface texture is exactly as I want.

Thanks.
Brayden256
 
Posts: 1
Joined: Sat Nov 03, 2018 6:15 am


Return to General Development

Who is online

Users browsing this forum: No registered users and 1 guest