Frequency bins
The analyser splits the audio spectrum into 128 bins, from low bass frequencies to high treble, each represented by one line around the circle.
Upload an audio file, hit play, and watch a radial frequency visualization dance to the music in real time. Nothing leaves your browser.
Press play to start the visualization.
This tool routes the audio element's output through a Web Audio AnalyserNode, a component built for reading frequency data without altering the sound itself. Many times per second it reports how much energy is present in each of a set of frequency bins, and the visualizer turns that into a ring of lines radiating out from the center.
The analyser splits the audio spectrum into 128 bins, from low bass frequencies to high treble, each represented by one line around the circle.
Each bin's current volume, from 0 to 255, is scaled into a line length so louder frequencies reach further from the center.
Hue shifts smoothly as you move around the circle, giving bass, mids and treble each a distinct band of color.
The animation loop only runs while audio is actually playing, pausing itself the instant you pause or the track ends.
It uses the Web Audio API's AnalyserNode to read the frequency spectrum of the audio many times per second, then draws one line per frequency bin radiating outward from a center point, with the line length based on that bin's volume.
No. The audio plays back exactly as uploaded through the built-in player. The visualizer only reads the frequency data for drawing and does not alter the sound.
The drawing loop is tied to playback: it only requests new animation frames while the audio element is playing, and stops automatically when you pause or the track ends, to save battery and CPU.
Any format your browser can play, including MP3, WAV, M4A and OGG.
No. The file is loaded directly into the browser's audio player and analyzed locally using the Web Audio API. It never leaves your device.
More handy tools from My Panda Toolbox.