java h5在线音频_H5 录音音频可视化

这段时间给 GitHub Recorder 开源库添加了两个新的音频可视化功能，比以前单一的动态波形显示丰富了好多(下图后两行是不是比第一行看起来丰满些)；趁热打铁写了一个音频可视化相关扩展测试代码，下面这张就是测试 Gif 截图，看起来还算过得去，测试地址

上面这些波形、频率的计算和显示都是由纯 js 代码编写的，并未用到浏览器专有特性，因此可以方便的移植到其他语言实现，比如移植到 Android、IOS 原生实现。

FrequencyHistogramView 音频可视化频率直方图显示

此功能源码：frequency.histogram.view.js + lib.fft.js 12kb 大小源码，音频可视化频率直方图显示；外观为上面 Gif 图最后一行，可通过参数配置绘制成不同的外观。

此扩展核心算法参考 Java 开源库 jmp123 的代码编写的，jmp123 版本 0.3；直方图我特意优化主要显示 0-5khz 语音部分，其他高频显示区域较小，不适合用来展示音乐频谱。

要获得 PCM 频率信息，需要将 PCM 由时域转换成频域，这里就用到了 FFT算法快速傅里叶变换，里面水很深我就没有深入研究了，这里直接用的 jmp123 里面的 FFT 实现，纯 js 代码实现 100 行不到。我们只管使用就 ok 了，假设有 44100hz 采样率的 16位 PCM 数据，取 1