【问题标题】:Web audio API equalizerWeb 音频 API 均衡器
【发布时间】:2015-07-15 21:39:42
【问题描述】:

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

我发现了很多关于创建可视化器的线程,但这当然不是我想做的。我只是希望能够使用频率滑块改变声音。我发现 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 个频率滑块 [32,64,125,250,500,1000,2000,4000,8000,16000]。 对于每个滑块,我创建一个过滤器并将其连接到源,如下所述: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;
};

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

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

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

不胜感激!

【问题讨论】:

    标签: javascript filter web-audio-api equalizer


    【解决方案1】:

    这里有很多东西。

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

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

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

    您可以在我的 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 和滤波器类型的频率响应。

    【讨论】:

    • 嗨,非常感谢,它解决了我的大部分问题,并且开始听起来不错。基本上,我现在只创建没有类型的过滤器,也没有连接它们。然后,我根据过滤器索引给出一个类型(0:lowshelf,0
    • 为每个频率组合低架和高架滤波器怎么样?
    • 例如,如果您想修改 250 赫兹增益,则在 350 处添加 lowshelf 以削减 350 以上的所有内容,并在 150 处添加第二个 highshelf 以削减 150 以下的所有内容。连接两个增益并立即修改它们的值?你认为这会奏效吗?
    • 这可以创建单个带通滤波器,但要重新组合每个波段的输出,您需要将它们并行连接(即将所有自定义带通滤波器连接到单个输出节点)。这不能很好地工作 - 每个滤波器都会以不同的量改变相位,并且您不能仅仅将输出相加,因为波形会分崩离析。您可以使用它单独创建带通,但不能制作 EQ。这与我使用峰值而不是带通来创建上面的 EQ 的原因相同 - 你需要一个串行信号链,而不需要重新组合不同的频率分量。
    【解决方案2】:

    一个问题是您希望滑块控制给定频率的滤波器增益,而不是滤波器频率本身。根据规范,带通滤波器的增益是不可控的,这有点限制。幸运的是,您可以在每个过滤器的末尾放置一个增益节点。

    var filter = this.context.createBiquadFilter();
    filter = this.context.createBiquadFilter();
    filter.type = 2;
    filter.frequency.value = frequency;
    
    var gain = this.context.createGainNode();
    
    // Connect source to filter, filter to the gain, gain to destination.
    this.source.connect(filter);
    filter.connect(gain);
    gain.connect(this.context.destination);
    this.filters[index] = filter;
    this.gains[index] = gain;
    

    接下来,您需要将滑块连接到增益控件的增益参数。我真的不知道网络音频,所以我会把它留给你。最后一件事是您需要指定过滤器的 Q。我从您尝试创建倍频程宽滤波器的频率列表中得到印象,因此 Q 因子可能在 1.414 左右。如果你想做到这一点,你真的需要做一些研究。

    【讨论】:

    • 感谢您的回复。你是对的,有一个错误。但我这边没有改善
    • 实际上它似乎可以正常工作。我刚刚做了@cwilso 建议的修改,效果很好,没有使用额外的增益节点
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-12-23
    • 1970-01-01
    • 2015-02-28
    • 2016-07-29
    • 2020-03-10
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多