let zoom = 1;

​

function setup() {

  createCanvas(600, 600);

  noFill();

}

​

function draw() {

  background(0); 

  let w = 4 / zoom;

  let h = (4 * height) / width / zoom;

​

  stroke(255); 

  for (let x = 0; x < width; x++) {

    for (let y = 0; y < height; y++) {

      let zx = map(x, 0, width, -2, 2) * zoom;

      let zy = map(y, 0, height, -2, 2) * zoom;

      let i = 0;

      while (i < 100) {

        let tmp = zx * zx - zy * zy + c.re;

        zy = 2.0 * zx * zy + c.im;

        zx = tmp;

        if (zx * zx + zy * zy > 4) break;

        i++;

      }

      if (i === 100) {

        point(x, y);

      }

    }

  }

​

  // Draw additional Julia sets

  drawAdditionalSets();

}

​

function mouseMoved() {

  c.re = map(mouseX, 0, width, -1.5, 1.5);

  c.im = map(mouseY, 0, height, -1.5, 1.5);

}

​

function mouseWheel(event) {

  zoom += event.delta * 0.001;

  zoom = constrain(zoom, 0.1, 10);

}

​

// Draw additional Julia sets

function drawAdditionalSets() {

  let sets = [

    { re: -0.7, im: 0.27015 },

    { re: 0.355, im: 0.355 },

    { re: -0.4, im: 0.6 },

    { re: 0.355, im: -0.355 },

    { re: -0.7, im: -0.27015 }

  ];

​

  for (let set of sets) {

    let zx, zy, i;

    for (let x = 0; x < width; x++) {

      for (let y = 0; y < height; y++) {

        zx = map(x, 0, width, -2, 2) * zoom;

        zy = map(y, 0, height, -2, 2) * zoom;

        i = 0;

        while (i < 100) {

          let tmp = zx * zx - zy * zy + set.re;

          zy = 2.0 * zx * zy + set.im;

          zx = tmp;

          if (zx * zx + zy * zy > 4) break;

          i++;

        }

        if (i === 100) {

          stroke(225); 

          point(x, y);

        }

      }

    }

  }

  //   if (key == 's'){

  //     save("mySVG.svg");

  //     noLoop();  

  // }

}

​