​

function setup() {

  createCanvas(400, 400);

  let xMin = -width/2

  let xMax = width/2

  let yMin = -height/2

  let yMax = height/2

}

​

function draw() {

  background('white');

  drawCoordSystem();

  fonctionCarre();

  pop();

}

​

function fonctionCarre(){

  for(let x=xMin; x<xMax; x+=5){

    let y = x*x;

    circle(0,0,20)

  }

}

​

function drawCoordSystem(){

    push();

    translate(width/2,height/2);

    scale(1, -1); // Flip the y-axis and x-axis

    // Draw Axis

    stroke('black');

    line(-width/2,0,width/2,0); // x-axis

    line(0,-height/2,0, height/2); // y-axis

    // Draw Y Lines

    stroke('grey');

    for(let y = -width/2; y < width/2 ; y+=50){

      line(-width/2,y,width/2,y); // x-axis

    }

    for(let x = -height/2; x < height/2 ; x+=50){

      line(x,-height/2,x, height/2); // y-axis

    }

    // Draw origin

    fill('black')

    circle(0,0,5);

​

    fill('red')

    circle(100,100,20);

​

​

​

}