47 lines
947 B
JavaScript
47 lines
947 B
JavaScript
let vec = p5.Vector
|
|
|
|
class ConstraintPoint {
|
|
constructor(x, y, size) {
|
|
this.size = size;
|
|
this.pos = new vec(x, y);
|
|
this.forward = new vec(0, 0);
|
|
}
|
|
|
|
follow(targetX, targetY) {
|
|
let target = new vec(targetX, targetY);
|
|
let targetForward = vec.sub(target, this.pos);
|
|
let targetAngle = targetForward.heading();
|
|
|
|
this.forward = p5.Vector.fromAngle(targetAngle);
|
|
|
|
let dir = p5.Vector.mult(this.forward, -this.size);
|
|
this.pos = vec.add(target, dir);
|
|
|
|
|
|
}
|
|
}
|
|
|
|
let points = []
|
|
function setup() {
|
|
createCanvas(400, 400);
|
|
|
|
for (let i = 0;i < 10;i++) {
|
|
points.push(new ConstraintPoint(0, 0, 20));
|
|
}
|
|
}
|
|
|
|
|
|
function draw() {
|
|
background(220);
|
|
|
|
points[0].follow(mouseX, mouseY)
|
|
for (let i = 1;i < 10;i++) {
|
|
let prev = points[i - 1];
|
|
points[i].follow(prev.pos.x, prev.pos.y);
|
|
}
|
|
for (let i = 1;i < 10;i++) {
|
|
let pos = points[i].pos;
|
|
noFill();
|
|
circle(pos.x, pos.y, 40);
|
|
}
|
|
}
|