Создание 10-полосного эквалайзера с помощью Web Audio API

Я пытаюсь обернуть голову с помощью веб-аудио API, чтобы воссоздать что-то вроде
10-полосный эквалайзер Winamp.

из того, что я могу собрать, я должен создать 10 Biquad Фильтров задайте их type to 2 (для полосового фильтра) и установить их frequency to [60, 170, 310, 600, 1000, 3000, 6000, 12000, 14000, 16000] соответственно. Как только я это сделаю (и вот где я немного запутался), я бы создал отдельный Получить Узле для каждый частотный "диапазон" и привязать его значение к ползуну.

<input id="someFreqBand" type="range" min="-12" max="12" step="0.1" value="0" onchange="slide()"/>

предполагая, что все это правильно, то единственным оставшимся шагом является подключение всех 10 узлов усиления к аудио контексту destination (который, я полагаю, возьмет все 10 частотных "полос" и смешает/синхронизирует их вместе). Является ли это правильным способом создания веб-аудио 10-полосного эквалайзера?

главное, что меня смущает, - это то, как я "подключаю" источник к 10 частотным полосовым фильтрам (+ связанный узел усиления), поскольку все узлы имеют только один вход или выход (включая назначение).

12
equalizer html5-audio javascript web-audio

3 ответов

Как сказал Мэтт D, не должно быть никаких проблем с подключением фильтров к тому же месту назначения.

однако я бы сказал, что вы, вероятно, хотите использовать фильтры с типом 5 (пик), который пропускает все частоты и только усиливает/уменьшает частоту, на которой вы установили соответствующий фильтр.частота.значение. Это позволяет подключать фильтры последовательно, так что вам не нужно 10 отдельных звуковых путей. Вы также можете рассмотреть возможность использования фильтра с низкой полкой в качестве первого фильтра и фильтр hi-shelf как десятый, который довольно распространен в эквалайзерах. Я не могу вспомнить, делает ли это winamp.

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

7

подключив каждый фильтр к месту назначения, вы создаете 5 путей (маршрутов), чтобы услышать пятикратное усиление исходного звука. Это неправильный путь. Вы должны соединить каждый фильтр в одну линию.

source.connect(filter1);
filter1.connect(filter2);
filter2.connect(filter3);
filter3.connect(filter4);
filter4.connect(filter5);
filter5.connect(context.destination);
10

главное, что меня смущает, - это то, как я "подключаю" источник к 10 частотным полосовым фильтрам (+ связанный узел усиления), поскольку все узлы имеют только один вход или выход (включая назначение).

это правда, но не думайте об этом как о физическом выходе, который может быть подключен только к другому физическому входу. Один выход узла веб-аудио может быть подключен к нескольким узлам, и узел также может получать несколько входов. Например, предположим, вы хотите связать входной узел через 5 фильтров параллельно, а затем объединить их вместе. Вы могли бы сделать что-то вроде этого:

source.connect(filter1);
source.connect(filter2);
source.connect(filter3);
source.connect(filter4);
source.connect(filter5);

filter1.connect(context.destination);
filter2.connect(context.destination);
filter3.connect(context.destination);
filter4.connect(context.destination);
filter5.connect(context.destination);

ключевое понимание здесь-это вызов .подключить несколько раз не переключит выход на другой узел, а просто добавить дополнительные выходные соединения. Другими словами, это система" fan out/fan in".

2