WebGL texture coordinates for cylinders

I have a problem calculating texture space coordinates for a cylinder in raw webgl (without using frames). I was able to create a polygon list of cylinders and normal vectors, but somehow I am struggling with the u, v textures. I was going to do this:

tex_step_x = 1 / divisions;

for(var u = 0; u < divisions; u++)
{   
    // Top plate
    textureCoordData.push(0.5); textureCoordData.push(0.5);
    textureCoordData.push(1); textureCoordData.push(0.5);
    textureCoordData.push(1); textureCoordData.push(0);

    // The walls
    textureCoordData.push(tex_step_x*u); textureCoordData.push(1);
    textureCoordData.push(tex_step_x*u+tex_step_x); textureCoordData.push(1);
    textureCoordData.push(tex_step_x*u); textureCoordData.push(0);

    textureCoordData.push(tex_step_x*u); textureCoordData.push(0);
    textureCoordData.push(tex_step_x*u+tex_step_x); textureCoordData.push(0);
    textureCoordData.push(tex_step_x*u+tex_step_x); textureCoordData.push(1);

    // Code for the bottom circle
    textureCoordData.push(0); textureCoordData.push(1);
    textureCoordData.push(1); textureCoordData.push(0);
    textureCoordData.push(1); textureCoordData.push(1);
}

      

The cylinder is made of "cake slices" for the bottom and top slabs (with different heights) and two triangles for each wall segment. Any ideas on how to calculate the correct u, v coordinates?

+3
javascript webgl texture-mapping


source to share


No one has answered this question yet

Check out similar questions:

4
Perspective Image / Texture Conversions with HTML5 Canvas
3
WebGL Texture resize unexpected output
2
Webgl - texture coordinates offset
1
webgl, texture coordinates and obj
0
Using ppm files for texture mapping in WebGL
0
Webgl using coordinates from texture
0
Webgl applies 1D texture to line
0
Projective mapping of textures in WebGL
0
Trigonometry issue causing distortion when drawing floor textures in raycaster
0
UV calculation on a custom 3d mesh



All Articles
Loading...
X
Show
Funny
Dev
Pics