title: P5.JS Create 3d Grid
body: <p>I know of the way in p5.js to create a grid of squares/rect in 2d, however i cannot seem to be able to create this in p5's 3d setting using webGL. I am trying to create a 3d grid &quot;of size 50x50x50 from -400 to 400 in the x-axis and -400 to 400 on the z-axis&quot;. However whenever i try to create this, it just seems to stay in a 2d setting.</p>
  <p>For example, the 2d method to do this is below, and i want the 3d to be the same consisting of a 16x16 grid</p>
  <pre><code>function setup() {
    createCanvas(400, 400);
  
    background(220);
    
    for (let x=0;x&lt;width;x+=20){
      for (let y=0;y&lt;height;y+=20){
          rect(x,y,20,20); 
      }
    }
  }
  </code></pre>
  <p>Any help adjusting this code to bring it to 3d would help massively, Ive looked around and cannot find any help on how to do this
  Im brand new to 3d primitives and webgl so help would be greatly appreciated.</p>
  <p>Below is how I am trying to get it to look</p>
  <p><a href="https://i.stack.imgur.com/pMFin.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/pMFin.png" alt="Image of how I want the grid to look" /></a></p>
  <p>Im aware, camera adjusting would ne needed also, but just wanted to take one step at a time.</p>
  <p>Thanks again</p>