Веб-аудио API эквалайзер

Я искал вокруг для создания аудио эквалайзера с помощью веб-аудио API:http://webaudio.github.io/web-audio-api/

Я нашел много потоков о создании визуализатора, но это конечно не то, что я хочу сделать. Я просто хочу иметь возможность изменять звук с помощью частоты ползунки. Я обнаружил, что биквадфильтр должен делать работу, но я не могу получить хороший результат. Звук изменяется последовательно, когда я изменяю любое значение частоты, но это просто снижает качество звука, в то время как он должен изменить частоты.

Я сначала загружаю звук:

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]. Для каждого слайдера я создаю фильтр и подключить его к источнику, как описано здесь: создание 10-полосного эквалайзера с помощью 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);
};

NB: мое это.функция gainScale принимает за вход значение в [0,1] и возвращает значение в [-40,40], чтобы установить коэффициент усиления между -40 и 40 для каждой частоты.

был бы признателен за любую помощь !

2 ответов


несколько вещей здесь.

1) Вы не должны использовать полосовые фильтры параллельно для реализации эквалайзера. Среди других проблем, биквад фильтрация изменяет фазу различных частей сигнала, и поэтому различные полосы будут в конечном итоге в разных фазах, и вы будете иметь некоторые потенциально довольно плохие эффекты на ваш звук, когда он рекомбинирует.

2) подход, который вы хотите, имеет фильтр с низкой полкой на нижнем конце, фильтр с высокой полкой на верхнем конце, и любое количество фильтров в середине. Они должны быть подключены последовательно (т. е. входной сигнал подключается к одному фильтру, который подключается к другому фильтру, который подключается к другому фильтру и т. д., И только конечный фильтр должен подключаться к audiocontext.назначение. Значения Q должны быть настроены (см. ниже), и усиление на фильтре определяет повышение/сокращение. (Для плоского ответа все усиления фильтра должны быть равны нулю.)

3 фильтра).тип перечислимый введите, что вы должны установить как строку, а не как число. "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 и фильтра.


одна проблема заключается в том, что вы хотите, чтобы ваши ползунки контролировали усиление фильтра на заданной частоте, а не саму частоту фильтра. Согласно спецификации увеличение полосового фильтра не controllable которое бит ограничивая. К счастью, вы можете поместить узел усиления в конце каждого фильтра.

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. Вам действительно нужно будет провести небольшое исследование, если вы хотите получить это право.