let centerX = 0;

let centerY = 0;

let radius = 0;

// true while drawing, false otherwise

let currentlyDrawing = false;

​

function setup() {

  createCanvas(400, 400);

}

​

function draw() {

  // clear the canvas

  background(220);

  // If the left mouse button is pressed...

  if (mouseIsPressed && mouseButton === LEFT)

  {

    // ... Then, if the drawing flag isn't set yet...

    if (currentlyDrawing === false)

    {

      // ... Then drawing has just now begun

      currentlyDrawing = true;

      // Store the mouse X and Y position in the center variables

      centerX = mouseX;

      centerY = mouseY;

    }

    // As long as the mouse button is held, update the radius

    // The radius equals the distance from the center to the mouse position

    radius = dist(centerX, centerY, mouseX, mouseY);

  }

  // Otherwise, if the left mouse button is not pressed...

  else

  {

    // ... Then we are not drawing, and we should clear the flag

    currentlyDrawing = false;

  }

  // Draw a circle at the chosen center with the chosen radius

  circle(centerX, centerY, radius * 2);

  // Draw a small dot at the center of the circle

  circle(centerX, centerY, 3);

  // Print the center and radius in the top-left corner

  text("Center X: " + centerX, 4, 16);

  text("Center Y: " + centerY, 4, 32);

  text("Radius: "   + radius,  4, 48);

}

​