Вы можете видеть, что он использует три узла: {{domxref ("OscillatorNode")}} в качестве источника, {{domxref ("GainNode")}} для управления томом и {{domxref ("GainNode")}} в качестве места назначения.С помощью Web Audio API, разработчики создают {{domxref("AudioContext", " аудиоконтекст")}}. Затем в этом контексте они создают ряд {{domxref ("AudioNode", "audio nodes")}}, включая:
Каждый узел имеет ноль или более свойств {{domxref ("AudioParam")}} которые настраивают его работу. Например {{domxref ("GainNode")}} имеет одно свойство усиления, в то время как {{domxref ("OscillatorNode")}} имеет частоту и свойства настройки.
Разработчик соединяет узлы в виде графика, а полный граф определяет поведение аудиопотока.
Web Audio Editor исследует аудиоконтекст, созданный на странице, и обеспечивает визуализацию его графика. Это даёт вам представление о его работе на высоком уровне и позволяет вам убедиться, что все узлы подключены так, как вы ожидаете. Затем вы можете изучить и отредактировать свойства AudioParam для каждого узла на графике. Некоторые свойства non-AudioParam, например свойство типа OscillatorNode, отображаются, и вы также можете их редактировать.
Этот инструмент все ещё экспериментальный. Если вы найдёте ошибки, мы будем рады, если вы отправите их в Bugzilla. Если у вас есть вопросы или предложения по новым функциям, ffdevtools.uservoice.com или Twitter отличные места для их регистрации.
Web Audio Editor по умолчанию не включён в Firefox 32. Чтобы включить его, откройте Настройки инструмента разработчика и отметьте «Web Audio». Теперь на панели инструментов Toolbox должна быть дополнительная вкладка с надписью «Web Audio». Щёлкните вкладку и загрузите страницу, которая создаёт звуковой контекст. Два хороших демки:
Теперь Web Audio Editor отобразит график загруженного аудиоконтекста. Вот график демоверсии The Violent:
Вы можете видеть, что он использует три узла: {{domxref ("OscillatorNode")}} в качестве источника, {{domxref ("GainNode")}} для управления томом и {{domxref ("GainNode")}} в качестве места назначения.
Отображение подключений к AudioParams является новым в Firefox 34.
Соединения между узлами отображаются сплошными линиями. Если вместо этого вы подключили узел к AudioParam в другом узле, то соединение будет показано пунктирной линией между узлами и будет помечено именем AudioParam:
Если вы нажмёте на узел, он подсветится, и вы получите инспектор узла справа. В этом списке перечислены значения свойств AudioParam этого узла. Например, вот как выглядит OscillatorNode:
В демоверсии Viplent, параметр частоты изменяется когда пользователь перемещает мышь влево и вправо, и вы можете увидеть это, отражённое в инспекторе узлов. Однако значение не обновляется в реальном времени: вам нужно снова щёлкнуть узел, чтобы увидеть обновлённое значение.
Если вы щёлкнете значение в инспекторе узлов, вы можете изменить его: нажмите Enter или Tab и новое значение вступит в силу немедленно.
Новое в Firefox 38.
В панели, которая показывает детали узла, есть кнопка включения / выключения:
Нажмите на него, и график будет изменён для обхода этого узла, поэтому он больше не будет иметь никакого эффекта. Узлы, которые обойдены, показаны заштрихованным фоном:
