Need to know the origin and coordinates for 2d texture and 2d/3d vertices in webgl
- by mathacka
Long story short, I know my coordinates are off and I believe my indices might be off.
I'm trying to render a simple 2d rectangle with a texture in webgl
here's the code I have for the vbo/ibo:
rectVertices.vertices = new Float32Array(
[
-0.5, -0.5, // Vertice 1, bottom / left
0.0, 0.0, // UV 1
-0.5, 0.5, // Vertice 2, top / left
0.0, 1.0, // UV 2
0.5, 0.5, // Vertice 3, top / right
1.0, 1.0, // UV 3
0.5, -0.5, // Vertice 4, bottom / right
1.0, 0.0, // UV 4
]);
rectVertices.indices = new Int16Array([
1,2,3,1,3,4
]);
/* I'm assuming the vertices go like this
(-0.5, 0.5) ------ ( 0.5, 0.5)
| |
| |
(-0.5,-0.5) ------ ( 0.5,-0.5)
with the origin in the middle
and the texture coordinates go like this:
( 0.0, 1.0) ------ ( 1.0, 1.0)
| |
| |
( 0.0, 0.0) ------ ( 1.0, 0.0)
so as you can see I'm all messed up.
I'm also using:
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
*/
So, I need to know the origins.
