Exhibit #3: Uniform Arrays

What We Did

• You can declare arrays of uniforms: uniform <type> <name>[<count>];
  • The number of array entries must be known at compile time.
• Examples:

  #define SHAPE_COUNT 16
  
  uniform vec2 centers[SHAPE_COUNT];
  uniform float sizes[SHAPE_COUNT];
  

• There are two ways to assign values to a uniform array.
  1. Get the location of each individual entry and assign each one separately with gl.uniform[1234][fi].
     • The names of the entries of the centers uniform are centers[0], centers[1], centers[2], ..., centers[15].
     • Here's how we assign the centers unform:

       for(var i=0; i<shapeCount; i++) {
           var centerUniformName = "centers[" + i + "]";
           var centerLocation = gl.getUniformLocation(program, centerUniformName);
           gl.uniform2f(centerLocation, centerX[i], centerY[i]);
       }
       

  2. Get the location of the first entry and assign all entries at the same time with gl.uniform[1234][fi]v
     • This version of gl.uniform allows you to pass an array to the GPU.
     • This is how we assign the sizes uniforms:

       var sizes = [];
       for(var i=0; i<shapeCount; i++) {
           sizes.push(0.01 + Math.random()*0.09);
       }
       
           :
           :
           :
       
       var sizeLocation = gl.getUniformLocation(program, "sizes[0]");
       gl.uniform1fv(sizeLocation, sizes);