That looks very cool. I have fond memories of working with analog oscilloscopes.

I started college in 2007, and they handled us newbies in EE analog oscilloscopes for learning, as it does not have the (in)famous auto-scale button.

Working with other engineers, I’m still the one that can handle an oscilloscope the best.

We can derive many parallels in education challenges arising from introduction of new automated functions in tech.

Don't forget the "Youscope" scene demo, another XY mode signal made to be displayed on oscilloscopes.

https://www.pouet.net/prod.php?which=31592

Unlike the "Oscillofun" song though, the scope signal is not the same as the audio signal.

In my secondary school, we had two contiguous rooms with computers. One has the modern one, color screen with Windows 3.1 or something.

The other room had the old computers, a monochrome white monitor, perhaps an orange Hercules monitor and also the old green one. In the green monitor the phosphorus took a looong time to fade away. When you turn it off, you can still read the content of the screen for like five seconds.

Cool! I tried to put it into my experimental tetris-like game here https://www.susmel.com/stacky/ - you can press R to have it rendered as such, toggle R once again for amber on black more and R again to normal render mode.

You could approximate this on <canvas> by drawing on multiple overlapping canvases: on every frame 1) clear the primary canvas and draw the waveform on it, 2) clear the secondaries with rgb(0,0,0,0.3) as the fill color (decrease the alpha for bigger blurs), 3) draw the primary on the secondaries. Apply additive blend mode and blur filters in CSS to the secondaries.

It’s not the most elegant solution, but more simple than drawing on one canvas.