Noise

Seeded Perlin noise, in two and three dimensions.
Unlike random(), noise varies smoothly — nearby inputs give nearby outputs — which makes it the tool of choice for organic motion, terrains and flow fields.

Syntax

                    
  var n = new noise(seed);
  n.perlin2d(x, y);      // returns a value in [0, 1]
  n.perlin3d(x, y, z);   // returns a value in [0, 1]
                

Parameters

seed Number : the same seed always produces the same noise field
x, y, z Number : sample coordinates; sample at fractional steps (e.g. 0.01–0.1 apart) for smooth variation

Use the third dimension as time: sampling perlin3d(x, y, t) with a slowly increasing t animates a 2D field smoothly.

Example

                    
    var n = new noise(7);
    var points = [];
    for (var x = 0; x < WIDTH; x += 5) {
        points.push([x, HEIGHT/2 + (n.perlin2d(x * 0.005, 0) - 0.5) * HEIGHT]);
    }
    new polygon(points, "none", 0, "#695fe6", 3);
              
        
    var n = new noise(3);
    var t = 0;
    function draw(){
        clearCanvas();
        for (var x = 20; x < WIDTH; x += 40) {
            for (var y = 20; y < HEIGHT; y += 40) {
                var v = n.perlin3d(x * 0.004, y * 0.004, t);
                new circle(x, y, v * 18, "#695fe6", v, "none", 0);
            }
        }
        t += 0.01;
        requestAnimationFrame(draw);
    }
    draw();