fractals.js

function $(value) {
  return document.querySelector(value);
}

const canvas = $('canvas');

const sets = [
  [-0.4, 0.0, 0.0, -0.4, -1.0, 0.1],
  [0.76, -0.4, 0.4, 0.76, 0.0, 0.0]
];

var point = [0, 0];

function drawPoint(ctx, currentPoint) {
  ctx.rect(currentPoint[0]*400+600, currentPoint[1]*400+300, 1, 1);
  ctx.stroke();
}

function progress(ctx) {
  drawPoint(ctx, point);
  point = calculateNextPoint(point);
}

function calculateNextPoint(currentPoint) {
  let func = sets[Math.floor(Math.random() * sets.length)];

  return [
    func[0]*currentPoint[0] + func[1]*currentPoint[1] + func[4],
    func[2]*currentPoint[0] + func[3]*currentPoint[1] + func[5]
  ];
}

(() => {
  let ctx = canvas.getContext('2d');

  // function () { er det samme som () => {
  setInterval(() => {
    progress(ctx);
  }, 1);
})();