预计算的 Web 音频 API 时域和频谱图可视化

Posted 2023-02-25

【中文标题】预计算的 Web 音频 API 时域和频谱图可视化

【英文标题】：Precomputed Web Audio API Time Domain and spectrogram Visualization

【发布时间】：2014-06-26 16:34:53

【问题描述】：

我正在使用各种振荡器/滤波器通过网络音频 api 合成声音，并在振荡器播放时实时运行时域和频谱图可视化（类似于 here 和 here）。

但是，我希望能够在音频网络运行一段时间之前创建一个基于音频网络的初始预计算可视化，以便用户可以在播放之前查看网络的声音。这是可能的还是有办法加快时间以快速生成可视化？

【参考方案1】：

使用 OfflineAudioContext，这会异步返回 PCM 缓冲区。从中计算窗口 RMS 值（或仅使用时域，取决于您想要做什么），并将其放在 a 或其他上。

OfflineAudioContext 可让您以与机器运行一样快的速度运行图形，并且是 AudioContext 的直接替代品，除了三个无法使用的节点（MediaStreamAudioDestinationNode、MediaStreamSourceNode 和 MediaElementAudiosourceNode），因为 MediaStream是实时对象：当不实时渲染时，它们毫无意义。

是这样的：

   var off = new OfflineAudioContext(2 /* stereo */,
                                     44100 /* length in frames */,
                                     44100 /* samplerate */);
   /* do your thing: setup your graph as usual */
   off.createOscillator(...);
   ...
   ...

   /* This is called when the graph has rendered one
    * second of audio, here: 44100 frames at 44100 frames per second */

   off.oncomplete = function(e) 
     e.renderedBuffer; /* is an AudioBuffer that contains the PCM data */
   ;
   /* kick off the rendering */
   off.startRendering();

【讨论】：

看起来正是我需要的，在阅读规范时一定错过了。谢谢！