| 13 | draw(); |
| 14 | |
| 15 | function draw() { |
| 16 | requestAnimationFrame(draw); |
| 17 | analyserNode.getByteTimeDomainData(dataArray); |
| 18 | |
| 19 | canvasContext.clearRect(0, 0, canvasElement.width, canvasElement.height); |
| 20 | canvasContext.lineWidth = 2; |
| 21 | canvasContext.strokeStyle = "white"; |
| 22 | canvasContext.beginPath(); |
| 23 | canvasContext.moveTo(0, canvasElement.height / 2); |
| 24 | |
| 25 | let x = 0; |
| 26 | let sliceWidth = canvasElement.width / bufferLength; |
| 27 | for (let i = 0; i < bufferLength; i++) { |
| 28 | let v = dataArray[i] / 128; |
| 29 | let y = canvasElement.height / 2 * v; |
| 30 | canvasContext.lineTo(x, y); |
| 31 | x += sliceWidth; |
| 32 | } |
| 33 | |
| 34 | canvasContext.lineTo(canvasElement.width, canvasElement.height / 2); |
| 35 | canvasContext.stroke(); |
| 36 | } |
| 37 | } |
| 38 | |
| 39 | //variables |