javascript - Wavesurfer 如何在加载真实峰值之前加载一些假峰值

Question

假设我们有一个像这样的 wavesurfer-js 播放器：

wavesurfer = WaveSurfer.create({
   container: document.querySelector('#lovelyContainer'),
   backend: 'MediaElement',
   // ... and other configs here ...
});

peaksGenerated = false;
wavesurfer.load(url);
wavesurfer.drawBuffer();


wavesurfer.on('ready', () => {
   // audio is ready to play   
   wavesurfer.playPause();
});


wavesurfer.on('waveform-ready', () => {
  // waveform is generated
  peaksGenerated = true;
});

此代码将在事件中播放音频ready，然后在waveform-ready生成 PCM 数据（峰值数组）时绘制峰值。在这一刻，我们有一个很好的球员。
但这里有一个问题。ready有时和之间会有差距waveform-ready。音频正在播放，但尚未生成 PCM 数据，并且视图中未显示任何波形。

我正在尝试做的事情：
我需要显示假峰值ready，然后使用生成的峰值更新它们waveform-ready。我怎样才能做到这一点？

标签： javascriptangularwavesurfer.js