Follow 2
A two-segmented arm follows the cursor position. The relative angle between the segments is calculated with atan2() and the position calculated with sin() and cos(). Based on code from Keith Peters.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
let x = [0, 0],
y = [0, 0],
segLength = 50;
function setup() {
createCanvas(710, 400);
strokeWeight(20.0);
stroke(255, 100);
}
function draw() {
background(0);
dragSegment(0, mouseX, mouseY);
dragSegment(1, x[0], y[0]);
}
function dragSegment(i, xin, yin) {
const dx = xin - x[i];
const dy = yin - y[i];
const angle = atan2(dy, dx);
x[i] = xin - cos(angle) * segLength;
y[i] = yin - sin(angle) * segLength;
segment(x[i], y[i], angle);
}
function segment(x, y, a) {
push();
translate(x, y);
rotate(a);
line(0, 0, segLength, 0);
pop();
}
