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();