2D Noise Vector Field Visualization

var t;

​

function setup() { 

  createCanvas(windowWidth, windowHeight); 

  background(0);  

  t = 0;

} 

​

function draw() {

  clear();

  visualizeGradient();

  t += 0.02;

}

​

function visualizeGradient() {

  var size = 30;

    var amp = 15;

    translate( width/2, height/2);

    stroke(255);

  for (var i = 0; i < size; i++) {

      for (var j = 0; j < size; j++) {

            var x = (i-size/2)*15;

      var y = (j-size/2)*15;

            var angle = 3*PI * noise(i * mouseX*0.0001 + t, 

                                     j * mouseY*0.0001 + t + 10);

          line( x, y, x + amp*cos(angle), 

                        y + amp*sin(angle));

        }

    }

}