I've setup 3 different instances of the same shader code (e.g. I've compiled the code into 3 separate programs)
For each program, I've gone through the whole route of something like this:
//Setup gl.useProgram(program); const buffer = gl.createBuffer(); const location = gl.getAttribLocation(program, aName); //Upload (each uses the buffer/location it created in Setup gl.useProgram(program); gl.bindBuffer(gl.ARRAY_BUFFER, buffer); gl.bufferData(gl.ARRAY_BUFFER, data, usagePattern); gl.vertexAttribPointer(location, nComponents, dataType, false, 0, 0); gl.enableVertexAttribArray(location); //Draw gl.useProgram(program); gl.vertexAttribPointer(location, 2, gl.FLOAT, false, 0, 0); gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
However, no matter what I pass into
data - e.g. different sized quads, all three are the same size.
Notably, changes to other uniforms/attributes like matrices and color do change per object
How do I change this so that the changes to data per instance will be drawn properly?
(I realize if they actually use the same shader I should maybe keep a reference to one program and use some sort of buffer pool- but I'm not there yet, just getting started with WebGL)