----- Coding Tutorial by Patt Vira ----- 

Name: Disco Grid (Perlin Noise)

Video Tutorial: https://youtu.be/sN7JotC3vdM?si=l9BMcGr_7fmHpxJT

​

Connect with Patt: @pattvira

https://www.pattvira.com/

----------------------------------------

*/

​

let sizes = [];

let cols; let rows; let size = 10;

let xoff = 0; let yoff = 0; let inc = 0.1;

let zoff = 0;

​

function setup() {

  createCanvas(400, 400);

  rectMode(CENTER);

  cols = width/size;

  rows = height/size;

}

​

function draw() {

  background(220);

  xoff = 0;

  for (let i=0; i<cols; i++){

    sizes[i] = [];

    yoff = 0;

    for (let j=0; j<rows; j++){

      sizes[i][j] = map(noise(xoff, yoff, zoff), 0, 1, 0, size*1.7);

      yoff += inc;

      let r = noise(zoff) * 255;

      let g = noise(zoff+15) * 255;

      let b = noise(zoff+30) * 255;

      fill(r, g, b);

      noStroke();

      rect(size/2 + i*size, size/2 + j*size, sizes[i][j], sizes[i][j]);

    }

    xoff += inc;

    zoff += 0.0003;

  }

​

}