​

function vectorProjection(a, b) {

  let bCopy = b.copy().normalize();

  let sp = a.dot(bCopy);

  bCopy.mult(sp);

  return bCopy;

}

​

function setup() {

  createCanvas(400, 400);

​

  a = createVector(100, -60);

  b = createVector(200, 60);

}

​

function draw() {

  noFill();

  background(0);

  strokeWeight(5);

  stroke(255);

  let pos = createVector(100, 200);

  let mouse = createVector(mouseX,mouseY);

  let a = p5.Vector.sub(mouse,pos);

  line(pos.x, pos.y, pos.x + a.x, pos.y + a.y);

  line(pos.x, pos.y, pos.x + b.x, pos.y + b.y);

​

  let v = vectorProjection(a, b);

  stroke(0, 255, 0);

  strokeWeight(10);

  line(pos.x, pos.y, pos.x + v.x, pos.y + v.y);

​

  circle(pos.x, pos.y, 10);

  circle(pos.x + a.x, pos.y + a.y, 10);

  circle(pos.x + v.x, pos.y + v.y, 10);

}

​