JS library for audio visualization in circular wave using Web Audio API and ECharts
Branch: master
Clone or download
Latest commit 20189d0 Feb 22, 2019


Circular Audio Wave

Circular WaveSunburst

Live Demo
Circular Wave: https://demo.kelvinau.net/circular-audio-wave/circular-wave.html
Sunburst: https://demo.kelvinau.net/circular-audio-wave/sunburst.html


CircularAudioWave is a JS library for audio visualization in circular audio wave, based on frequencies and BPM (Beats Per Minute). It uses ECharts for the rendering, which is combined into dist/circular-audio-wave.min.js.

*This library works only on browsers that supports Web Audio API.


Class CircularAudioWave(elem, opts={}) where elem is an DOM element object and opts provides configuration.
Configuration consists of:

  • mode: 'sunburst' for sunburst chart (default: false)
  • loop: loop rendering the chart (default: false)


  • loadAudio: provides the path of the audio file
  • play: plays audio and render chart


See circular-wave.html and sunburst.html in demo.


Sample demo tracks are obtained from:

Tempo detection is based on José M. Pérez's research. See here for more details.