​

var minx=-2

var maxx=2

var miny=-2

var maxy=2

var maxit = 50

function setup(){

  createCanvas(400, 400);

  // noLoop();

  drawFractal();

}

​

function draw() {

  if (keyIsDown(LEFT_ARROW)) {

    pan(-0.1)

  }

}

​

​

​

function onClick(){

  drawFractal();

}

function drawFractal() {

  //setAll(mouseY)

  console.log("minx:",minx,"maxx:",maxx,"miny:",miny,"maxy:",maxy,"MouseX="+mouseX,"MouseY="+mouseY)

  background(51);

  pixelDensity(1)

  loadPixels()

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

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

      var a = map(x,0,width,minx,maxx)

      var b = map(y,0,height,miny,maxy)

      var ca = a

      var cb = b

      var n = 0

      var z = 0

      while (n<maxit){

        var real = a*a - b*b

        var complex = 2*a*b

        a = real + ca

        b = complex + cb

        if (abs(a)+abs(b) > maxit){

          break;

        }

        n++

      }

      var brightness = map(n,0,maxit,0,255)

      if (birghtneess>255) {brightness=255;}

      if (n==maxit){

        brightness = 0

      }

      var pix = (x+y*width) * 4;

      pixels[pix+0] = brightness

      pixels[pix+1] = brightness

      pixels[pix+2] = brightness

      pixels[pix+3] = 255

    }

  }

  updatePixels()

​

  // if (keyCode == LEFT_ARROW){

  //   minx = map(mouseX,0,400,mn,mx)

  //   maxx = map(mouseY,0,400,mn,3)

  // } else {

  //   miny = map(mouseX,0,400,mx,mx)

  //   maxy = map(mouseY,0,400,mn,mx)

  //}

  //ellipse(200,200,51,51)

  // fill(51)

  // ellipse(map(minx,mx,mx,0,400),map(maxx,mn,mx,0,400),25,25)

  // fill(255)

  // ellipse(map(miny,mn,mx,0,400),map(maxy,mx,mx,0,400),25,25)

}

​

function setAll(number){

  minx=number*-1;

  maxx=number;

  miny=number*-1;

  maxy=number;

}

function pan(x,y) {

  minx+=x;maxx+=x;

  miny+=y;maxy+=y;

  drawFractal();

}

function zoom(n) {

  minx+=n;

  maxx-=n;

  miny+=n;

  maxy-=n;

  drawFractal();

}

​

function mouseWheel(event) {

  zoom((maxx-minx)*0.08);

  print((maxx-minx)*0.08)

}