easing_p5js.js

let t = 0;
let x, y, tx, ty, cx, cy;

function setup() {
  createCanvas(400, 400);
  x = random(width);
  y = random(height);
  tx = random(width);
  ty = random(height);
}

function draw() {
  background(220);

  let v = easeInOutCubic(t);
  cx = lerp(x, tx, v);
  cy = lerp(y, ty, v);

  line(x, y, tx, ty);
  circle(x,y,3);
  circle(tx,ty,3);
  
  circle(cx, cy, 30);

  t += 1 / 60;
  if (t > 1) {
    x = tx;
    y = ty;
    tx = random(width);
    ty = random(height);
    t = 0;
  }
}

function easeInOutCubic(x) {
  return x < 0.5 ? 4 * x * x * x : 1 - pow(-2 * x + 2, 3) / 2;
}