🌍 Public
Viewing a saved revision (read-only)
7a48992ac66947a3a6bed9822a8a6913
SpectrogramJS
A spectrogram visualization displays the frequency spectrum of an audio file over time, rendered as a scrolling heatmap across a canvas. The example loads a duck sound effect, analyzes it with the Web Audio API’s `AnalyserNode`, and records frequency data during playback. D3.js draws the axes and scale grid as SVG overlays, while the spectrogram’s pixel data is painted onto the canvas. Playback and analysis run via `ScriptProcessorNode` and `requestAnimationFrame`, and the visualization updates in real time until the sound finishes.
AI-generated descriptionAn example showing the capabilities of VizHub.