wavesurfer.js

Web Audio Waveform Visualizer

Customizable waveform audio visualization built on top of Web Audio API and HTML5 Canvas. With wavesurfer.js you can assemble a full-featured HTML5 audio player or create a sophisticated DJ application.

Compatibility

wavesurfer.js runs on modern browsers supporting Web Audio. Including Firefox, Chrome, Safari, Mobile Safari and Opera.

Download

Download wavesurfer.min.js (20 KB)

Quick Start

var wavesurfer = Object.create(WaveSurfer);

wavesurfer.init({
    container: document.querySelector('#wave'),
    waveColor: 'violet',
    progressColor: 'purple'
});

wavesurfer.on('ready', function () {
    wavesurfer.play();
});

wavesurfer.load('example/media/demo.mp3');

Documentation

The full list of options and methods can be found in README.

Recommended Literature



Plugins & Examples

Thanks to the everyting-is-public API, it's easy to write wavesurfer.js plugins.

Fork me on GitHub