How to tell WebGL which size to show object in?

I’m starting out with webGL and have gone through some tutorials here:

http://learningwebgl.com/blog/?page_id=1217

I can take the first lesson as an example. In the function initBuffers() the buffer for a triangle is created like below:

``````function initBuffers() {
triangleVertexPositionBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer);
var vertices = [
0.0,  1.0,  0.0,
0.0, -1.0,  0.0,
1.0, -1.0,  0.0
];
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
triangleVertexPositionBuffer.itemSize = 3;
triangleVertexPositionBuffer.numItems = 3;
...
``````

The elements (or coordinates) in the vertex array goes from -1 to 1.

Now, what if I have coordinates with much smaller values like below:

``````var vertices = [
``````

0.0207835, -0.0756165, 0.6492073,
0.02266111, -0.0711677, 0.6476236,
0.02020269, -0.08112079, 0.6501749];

They are not shown because (I assume) the values are too small. Where in the code do I tell webGl that it should “zoom” in so that the small-value vertices does become visible?

Thanks for help!

Well, many ways:

1. Just make the vertices bigger.
2. Use the vertex shader to multiply all of the vertex numbers by some value.
3. More likely - create a 4x4 matrix describing how you would like your model to be transformed in 3D space.
4. Ideally - create two or perhaps even three 4x4 matrices. One that transforms your model (let’s say it’s a car with the origin in the middle of the car) to position it into the virtual world. A second that transforms the virtual world relative to wherever you want your camera/eyepoint to be. A third that performs the perspective (or perhaps orthographic) transformation into “screen space”. These matrices are typically either multiplied together and then used to transform the vertices in the vertex shader - or perhaps applied to transform the vertices in three stages from “model space” to “world space” to “camera space” and finally to “screen space”.

This is a deep subject - really too much to describe adequately in a forum post. I would strongly recommend that you buy (and read!) the OpenGL “red book”. Not all of it applies to WebGL - but all of the stuff about how to position things using matrices is covered in wonderful detail.

http://www.amazon.com/OpenGL-Programmin … 791&sr=1-1