​

let num = 100000;

let noiseScale = 0.01;

​

function setup() {

  createCanvas(400, 400);

  calcDistr();

  noLoop();

  textAlign(CENTER);

}

​

function draw() {

  background(220);

  for(let d in distr) {

    d = Number(d);

    rect(d * width, height, 0.01 * width, distr[d] * -0.1);

  }

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

    text(i/10, width * i/10, 50);

  }

}

​

function calcDistr() {

  distr = {};

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

    let raw = noise(i * noiseScale);

    // *2 % 1 flattens the curve

    // but unsure what it would do to

    // the smooth nature of Perlin noise

    // I think you would get some weird

    // stuff happening

    // let n = dec((raw * 2)%1, 0.01);

    let n = dec(raw, 0.01);

    if(!(n in distr)) {

      distr[n] = 1;

    } else {

      distr[n] ++;

    }

  }

}

​

function mouseReleased() {

  noiseSeed(millis());

  calcDistr();

  draw();

}

​

// returns val at given precision

// eg -> 0.123 at 0.01 pr gives 0.12

function dec(val, pr) {

  return ((val * 1/pr) | 0) * pr;

}