Input Buffers

OpenGL reads attribute data from buffers.

 84                 // Generate a buffer from a JS data array
 85                 function createBuffer(JSarray)
 86                 {
 87                     // This is a handle to what will be a buffer
 88                     var vertexBuffer = gl.createBuffer();
 89                     // Binding an object in Open GL creates it, and makes it the target of subsequent manipulations.
 90                     gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
 91                     // loads the current buffer, the vertexBuffer found above, with the vertex data.
 92                     // The gl bufer is strongly types with 32 bit floating data.
 93                     gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(JSarray), gl.STATIC_DRAW);
 94 
 95                     return vertexBuffer;
 96                 }
(0,1) (-1,-1) (1,-1)

Notes

The first step is to create the buffer and keep an integer reference to it.

Next, bindBuffer creates a specific type of buffer, and makes that buffer the currently active buffer.

The last step loads the data into the buffer. The data is pcked into a Float32Array, which is a native array of floats. The STATIC_DRAW option tells OpenGL that this data is not expected to change - allowing OpenGL to make several optimizations.

Remember that to use our vertex data, we have to pack it into a Float32Array, which is a native array of floats. These were brought into JavaScript from WebGL for performace, and are now seeing wider use.