我发现了许多关于创建可视化工具的线索,但这当然不是我想要做的.我只是希望能够使用频率滑块改变声音.我发现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之间的增益.

非常感谢任何帮助！