javascript - Web 音频 API 均衡器

标签 javascript filter web-audio-api equalizer

我一直在寻找使用 Web 音频 API 创建音频均衡器的方法:http://webaudio.github.io/web-audio-api/

我发现了很多关于创建可视化工具的话题,但这当然不是我想要做的。我只是希望能够使用频率 slider 改变声音。我发现 biquadFilter 应该可以完成这项工作,但我得不到好的结果。当我改变任何频率值时,声音都会持续改变,但它只会降低声音的质量,而它应该改变频率。

我首先加载一个声音:

Audio.prototype.init = function(callback){
    var $this = this;
    this.gainScale = d3.scale.linear().domain([0,1]).range([-40,40]);
    this.context = new AudioContext();
    this.loadSounds(function(){
        $this.loadSound(0);
        $this.play();
        callback.call();
    });
};

一切正常,准备就绪时会播放声音。

我有 10 个频率 slider [32,64,125,250,500,1000,2000,4000,8000,16000]。 我为每个 slider 创建一个过滤器并将其连接到源,如下所述:Creating a 10-Band Equalizer Using Web Audio API :

Audio.prototype.createFilter = function(index,frequency){
    if(this.filters == undefined) this.filters = [];
    var filter = this.context.createBiquadFilter();
    filter = this.context.createBiquadFilter();
    filter.type = 2;
    filter.frequency.value = frequency;
    // Connect source to filter, filter to destination.
    this.source.connect(filter);
    filter.connect(this.context.destination);
    this.filters[index] = filter;
};

最后,当我更改 slider 的值时,我会更新过滤器:

Audio.prototype.updateFilter = function(index,newVal){
    this.filters[index].frequency.gain = this.gainScale(newVal);
};

注意:我的 this.gainScale 函数将 [0,1] 中的值作为输入并返回 [-40,40] 中的值以将每个频率的增益设置在 -40 到 40 之间。

非常感谢任何帮助!

最佳答案

这里有很多东西。

1) 您不应并行使用带通滤波器来实现均衡器。除其他问题外,双二阶滤波会改变信号不同部分的相位,因此不同的频段最终会处于不同的相位,当它重新组合时,您可能会对声音产生一些非常糟糕的影响。

2) 您想要的方法是在底端有一个低架滤波器,在顶端有一个高架滤波器,在中间有任意数量的峰值滤波器。这些应该串联(即输入信号连接到一个过滤器,连接到另一个过滤器,连接到另一个过滤器,等等,只有最后一个过滤器应该连接到 audiocontext.destination。Q 值应该是调谐(见下文),滤波器的增益决定提升/削减。(对于平坦响应,所有滤波器增益应设置为零。)

3) filter.type 是一个枚举类型,您应该将其设置为字符串,而不是数字。 “lowshelf”、“highshelf”和“peaking”是您在这里寻找的。

您可以在我的 DJ 应用程序中看到一个简单的三波段均衡器示例 - https://github.com/cwilso/wubwubwub/blob/MixTrack/js/tracks.js#L189-L207设置它。要将其修改为多频段均衡器,您需要调整每个滤波器的 Q 值以使频段不会重叠太多(如果它们确实重叠也不错,但如果您调整它们,您的频段会更精确) .您可以使用 http://googlechrome.github.io/web-audio-samples/samples/audio/frequency-response.html检查给定 Q 值和滤波器类型的频率响应。

关于javascript - Web 音频 API 均衡器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30065093/

相关文章:

javascript - 如何将 React 置于生产模式?

javascript - 如何选择显示:none labels from the div

javascript - 如何在 SvelteKit 中设置 SCSS 导入的基本路径?

python - Python中另一个列表的子字符串过滤器列表元素

angular - 将本地文件导入AudioWorkletProcessor文件时出现意外的标识符错误

javascript - 使用 WaveShaper 控制 Osc 频率会导致无输出

javascript - 如何在javascript中编写html代码?

Angular 2 : FilterPipe : Cannot read property 'filter' of undefined

ios - iOS 中的谷歌地图有过滤器

javascript - 波表合成 - WebAudioApi