Mouse Signals
Move and click the mouse to generate signals. The top row is the signal from "mouseX", the middle row is the signal from "mouseY", and the bottom row is the signal from "mouseIsPressed".
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
34
35
36
37
38
39
40
41
42
43
44
45
46
let xvals = [];
let yvals = [];
let bvals = [];
function setup() {
createCanvas(720, 400);
strokeWeight(2);
}
function draw() {
background(237, 34, 93);
for (let i = 1; i < width; i++) {
xvals[i - 1] = xvals[i];
yvals[i - 1] = yvals[i];
bvals[i - 1] = bvals[i];
}
// Add the new values to the end of the array
xvals[width - 1] = mouseX;
yvals[width - 1] = mouseY;
if (mouseIsPressed) {
bvals[width - 1] = 0;
} else {
bvals[width - 1] = 255;
}
fill(255);
noStroke();
rect(0, height / 3, width, height / 3 + 1);
for (let i = 1; i < width; i++) {
stroke(255);
point(i, xvals[i] / 3);
stroke(0);
point(i, height / 3 + yvals[i] / 3);
stroke(255);
line(
i,
(2 * height) / 3 + bvals[i] / 3,
i,
(2 * height) / 3 + bvals[i - 1] / 3
);
}
}