PannerNode: свойство orientationX
Базовая линия Широко доступно
Эта функция хорошо отработана и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с апреля 2021 года.
Свойство orientationX интерфейса PannerNode указывает на X-компонент (горизонтальную) составляющую направления, в котором направлен источник звука в трехмерном декартовом пространстве.
Полный вектор определяется положением источника звука, заданным как (positionX, positionY, positionZ), и ориентацией источника звука (то есть, направлением, в котором он смотрит), заданным как (orientationX, orientationY, orientationZ).
В зависимости от направленности звука (как задано с помощью атрибутов coneInnerAngle, coneOuterAngle и coneOuterGain), ориентация звука может изменить воспринимаемую громкость звука во время воспроизведения. Если звук направлен на слушателя, он будет громче, чем если звук направлен от слушателя.
Объект AudioParam, содержащийся в этом свойстве, является только для чтения; однако вы все равно можете изменить значение параметра, присвоив новое значение его свойству AudioParam.value.
Значение
Объект AudioParam, чье значение является X-компонентом направления, в котором направлен источник звука в трехмерном декартовом пространстве.
Пример
В этом примере мы продемонстрируем, как изменение параметров ориентации PannerNode в сочетании с coneInnerAngle и coneOuterAngle влияет на громкость. Чтобы визуализировать, как вектор ориентации влияет, мы можем использовать правило правой руки:
Сначала давайте напишем вспомогательную функцию, чтобы определить наш вектор ориентации. X и Z компоненты всегда находятся под углом 90° друг к другу, поэтому мы можем использовать функции синуса и косинуса, которые смещены на одинаковую величину в радианах. Однако, обычно это означает, что PannerNode направлен влево от слушателя при вращении на 0° – так как x = cos(0) = 1 и z = sin(0) = 0. Более полезно сместить угол на -90°, что означает, что PannerNode будет направлен прямо на слушателя при вращении на 0°.
// this utility converts amount of rotation around the Y axis
// (i.e. rotation in the 'horizontal plane') to an orientation vector
const yRotationToVector = (degrees) => {
// convert degrees to radians and offset the angle so 0 points towards the listener
const radians = (degrees - 90) * (Math.PI / 180);
// using cosine and sine here ensures the output values are always normalized
// i.e. they range between -1 and 1
const x = Math.cos(radians);
const z = Math.sin(radians);
// we hard-code the Y component to 0, as Y is the axis of rotation
return [x, 0, z];
};
Теперь мы можем создать наш AudioContext, генератор и PannerNode:
const context = new AudioContext(); const osc = new OscillatorNode(context); osc.type = "sawtooth"; const panner = new PannerNode(context); panner.panningModel = "HRTF";
Далее, мы настраиваем конус нашего пространственного звука, определяя область, в которой его можно услышать:
// this value determines the size of the area in which the sound volume is constant // if coneInnerAngle === 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneInnerAngle = 30; // this value determines the size of the area in which the sound volume decreases gradually // if coneOuterAngle === 45 and coneInnerAngle === 30, it means that when the sound is rotated // by between 15 (30/2) and 22.5 (45/2) degrees either direction, // the volume will decrease gradually panner.coneOuterAngle = 45; // this value determines the volume of the sound outside of both inner and outer cone // setting it to 0 means there is no sound, so we can clearly hear when we leave the cone // 0 is also the default panner.coneOuterGain = 0; // increase the Z position to ensure the cone has an effect // (otherwise the sound is located at the same position as the listener) panner.positionZ.setValueAtTime(1, context.currentTime);
Настроив PannerNode, мы можем теперь запланировать некоторые обновления его вращения по оси Y:
// calculate the vector for no rotation // this means the sound will play at full volume const [x1, y1, z1] = yRotationToVector(0); // schedule the no-rotation vector immediately panner.orientationX.setValueAtTime(x1, context.currentTime); panner.orientationY.setValueAtTime(y1, context.currentTime); panner.orientationZ.setValueAtTime(z1, context.currentTime); // calculate the vector for -22.4 degrees // since our coneOuterAngle is 45, this will just about make the sound audible // if we set it to +/-22.5, the sound volume will be 0, as the threshold is exclusive const [x2, y2, z2] = yRotationToVector(-22.4); panner.orientationX.setValueAtTime(x2, context.currentTime + 2); panner.orientationY.setValueAtTime(y2, context.currentTime + 2); panner.orientationZ.setValueAtTime(z2, context.currentTime + 2);
Наконец, давайте соединим все наши узлы и запустим генератор!
osc.connect(panner).connect(context.destination); osc.start(0);
Спецификации
| Спецификация |
|---|
| Web Audio API # dom-pannernode-orientationx |
Совместимость с браузерами
| Рабочие столы | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
orientationX |
52 | 79 | 50 | 39 | 14.1 | 52 | 50 | 41 | 14.5 | 6.0 | 52 |
См. также
© 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/PannerNode/orientationX