Two-Point Transform

let points = [

  {x: 100, y: 100, color: 'lightgreen'},

  {x: 400, y: 100, color: 'lightblue'},

];

let radius = 20;

let dragging = null;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

}

​

function draw() {

  background(100);

  let [{x: x0, y: y0}, {x: x1, y: y1}] = points;

  for (let {x, y, color: c} of points) {

    fill(c);

    circle(x, y, 2 * radius);

  }

}

​

function mousePressed() {

  dragging = points.find(({x, y}) => dist(x, y, mouseX, mouseY) < radius);

}

​

function mouseDragged() {

  if (dragging) {

    dragging.x = mouseX;

    dragging.y = mouseY;

  }

}