BaseAudioContext: метод createStereoPanner()
Базовый уровень Широко доступен
Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с апреля 2021 года.
Метод createStereoPanner() интерфейса BaseAudioContext создаёт StereoPannerNode, который может использоваться для применения стереопанорамирования к аудиоисточнику. Он позиционирует входящий аудиопоток в стереоизображении, используя алгоритм панорамирования с низкими затратами.
Примечание: Конструктор StereoPannerNode() является рекомендуемым способом создания StereoPannerNode; см. Создание узла AudioNode.
Синтаксис
createStereoPanner()
Параметры
Нет.
Возвращаемое значение
Объект StereoPannerNode.
Примеры
В нашем примере StereoPannerNode (см. исходный код) HTML у нас есть простой элемент <audio> вместе с ползунком <input> для увеличения и уменьшения значения панорамирования. В JavaScript мы создаём MediaElementAudioSourceNode и StereoPannerNode и соединяем их вместе, используя метод connect(). Затем мы используем обработчик событий oninput для изменения значения параметра StereoPannerNode.pan и обновления отображения значения панорамирования при перемещении ползунка.
Перемещение ползунка влево и вправо во время воспроизведения музыки панорамирует музыку на левые и правые динамики вывода соответственно.
const audioCtx = new AudioContext();
const myAudio = document.querySelector("audio");
const panControl = document.querySelector(".panning-control");
const panValue = document.querySelector(".panning-value");
// Create a MediaElementAudioSourceNode
// Feed the HTMLMediaElement into it
const source = audioCtx.createMediaElementSource(myAudio);
// Create a stereo panner
const panNode = audioCtx.createStereoPanner();
// Event handler function to increase panning to the right and left
// when the slider is moved
panControl.oninput = () => {
panNode.pan.setValueAtTime(panControl.value, audioCtx.currentTime);
panValue.textContent = panControl.value;
};
// connect the MediaElementAudioSourceNode to the panNode
// and the panNode to the destination, so we can play the
// music and adjust the panning using the controls
source.connect(panNode);
panNode.connect(audioCtx.destination);
Спецификации
Совместимость с браузерами
| Настольные | Мобильные | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на IOS | Samsung Internet | WebView Android | |
createStereoPanner |
41 | 12 | 37 | 28 | 14.1 | 41 | 37 | 28 | 14.5 | 4.0 | 41 |
См. также
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createStereoPanner