-
Notifications
You must be signed in to change notification settings - Fork 0
/
25khz.js
42 lines (31 loc) · 964 Bytes
/
25khz.js
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
let canvas, ctx, wave, theta;
window.onload = () => {
canvas = document.getElementById("canvas");
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
ctx = canvas.getContext("2d");
wave = {
y: window.innerHeight / 2,
length: 200000,
amplitude: 200,
speed: 0.013
};
theta = 0;
window.requestAnimationFrame(animation);
};
function animation(timestamp) {
window.requestAnimationFrame(animation);
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.beginPath();
ctx.moveTo(0, window.innerHeight / 2);
ctx.strokeStyle = `rgb(0, 255, 0)`;
ctx.lineWidth = 1;
// NOTE: Right waves
ctx.beginPath();
ctx.moveTo(window.innerWidth / 2, window.innerHeight / 2);
for (let i = window.innerWidth / 2; i < window.innerWidth; i++) {
ctx.lineTo(i, wave.y + Math.sin(i * wave.length + theta) * wave.amplitude);
}
ctx.stroke();
theta += wave.speed;
}