Split Channel Waveforms
Drag'n'drop your -file here!
How to Enable Split Channels
Set the splitChannels option to true.
var wavesurfer = WaveSurfer.create({
container: document.querySelector('#wave'),
splitChannels: true
});
Split Channel Options
The split channel view can be modified with the splitChannelsOptions. The waveforms can be stacked on top of each other. And colors can be added to each channel.
var wavesurfer = WaveSurfer.create({
container: document.querySelector('#wave'),
splitChannels: true,
splitChannelsOptions: {
overlay: false,
channelColors: {
0: {
progressColor: 'green',
waveColor: 'pink'
},
1: {
progressColor: 'orange',
waveColor: 'purple'
}
}
}
});
// change channel 0 progress color
wavesurfer.setProgressColor('red', 0);
// change channel 1 wave color
wavesurfer.setWaveColor('blue', 1);
// get channel 0 progress color
wavesurfer.getProgressColor(0);
splitChannelOptions
overlay - boolean - This determines whether channels are drawn on top of each other.
channelColors - object - Pass this to set colors for each channel. If the channel index is not found on the object, colors will default to the top level color params.
filterChannels - array - Array of channel numbers. Channels included in the array will not be drawn.
relativeNormalization - boolean - When normalize and splitChannels are both true the channels will be normalized individually or proportionally to each other. Defaults to false (each channel will be normalized in isolation).
