关于可视化图形频谱数据的问题

[MrZJD]

关于之前在开会的时候提出过的问题，是否可以从getByteFrequencyData看出有实际意义的数据变化。

我这边查找MDN及其他资料发现，数据原谱即真实存在的数据为时域谱，即横轴为时间，纵轴为幅度，频率由斜率(或者说周期决定)。通过傅里叶变化，可以获取其转换后的频域谱，横轴为频率，纵轴为幅度。

那么问题就是采样的问题。根据MDN显示，AnalyserNode.minDecibels表示频谱结果的最小值，AnalyserNode.maxDecibels表示频谱结果的最大值。也就是说getByteFrequencyData的结果，表示在 A - [AnalyserNode.minDecibels, AnalyserNode.maxDecibels]上幅度的变化。

最后可视化的逻辑中

let array = new Uint8Array(this.analyser.frequencyBinCount)
this.analyser.getByteFrequencyData(array)

array.length与this.analyser.frequencyBinCount相等，所以frequencyBinCount与AnalyserNode.maxDecibels - AnalyserNode.minDecibels共同决定了采样的精度，即单位长度上有表示多少赫兹的频率范围的数据量。

至此，可以了解到。我们可视化的数据步长可以直接使用array.length | frequencyBinCount，来表示实际的精度，如果需要降低可视化的步长，减少fftSize值的大小即可。当然也可以像您的代码中那样，自定义步长，但是这样就存在一部分数据没必要计算(因为我们并没有使用到)。

存在理解有误的地方，望指出。感恩~