Spectrogram frequency labels
Date: March 2, 2017The spectrogram plugin for WaveSurfer.js now supports frequency labels. I've implemented this to the master library and will be available on version 1.3.2.
How to enable to frequency labels:
Step 1 - create the WaveSurfer object
var wavesurfer = WaveSurfer.create({
container: '#waveform',
waveColor: '#D2EDD4',
progressColor: '#46B54D'
});
Step 2 - create the Spectrogram plugin inside the wavesurfer 'ready' event
wavesurfer.on('ready', function () {
var spectrogram = Object.create(WaveSurfer.Spectrogram);
spectrogram.init({
wavesurfer: wavesurfer,
container: "#wave-spectrogram",
fftSamples: 1024,
labels: true
});
});
Step 3 - load some music
wavesurfer.load('http://wavesurfer-js.org/example/media/demo.wav');
Links: WaveSurfer.jsSpectrogram Frequency Labels Sample
See the Pen Spectrogram frequency labels by Enton Biba (@entonbiba) on CodePen.