Skip to main content

Command Palette

Search for a command to run...

Perlin noise

Updated
1 min read

A good random number generator produces numbers that have no discernible pattern to the numbers that are generated. In nature, even though there is randomness the behavior is not completely chaotic. We can simulate this behavior with Perlin noise.

Perlin noise can be used to generate different effects such as landscapes and clouds.

Here is code in p5.js that I am using to create a circle and move it ever so slowly on the canvas:

var t=0;
function setup() {
  createCanvas(400, 400);
}

function draw() {

  background(51);

  var y = map(noise(t),0,1,0,width);

  circle(y,180,16);
  t += 0.001;

}