Signatur
Beschreibung
Die Eigenschaft distanceModel eines PannerNode bestimmt, wie stark eine Audioquelle leiser wird, wenn sie sich im 3D-Raum vom AudioListener entfernt. Sie ist lesbar und beschreibbar und akzeptiert einen von drei Zeichenketten-Werten. Der Standardwert ist "inverse".
"linear": Verstärkung =1 - rolloffFactor * (d - refDistance) / (maxDistance - refDistance), wobeidauf den BereichrefDistance…maxDistancebegrenzt wird. AbmaxDistanceist die Quelle (beirolloffFactor = 1) stumm – ideal für Spiele mit klarer Hörweite."inverse": Verstärkung =refDistance / (refDistance + rolloffFactor * (max(d, refDistance) - refDistance)). Entspricht annähernd dem natürlichen Abfall und wird nie ganz still."exponential": Verstärkung =pow(max(d, refDistance) / refDistance, -rolloffFactor). Erlaubt überrolloffFactoreinen sehr steilen oder sehr flachen Abfall.
Das Modell wirkt immer zusammen mit refDistance, maxDistance und rolloffFactor. Innerhalb von refDistance bleibt die Lautstärke bei allen Modellen unverändert (Verstärkung 1). Das Umschalten ist jederzeit während der Wiedergabe möglich.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $value | "linear" | "inverse" | "exponential" | "inverse" | Beim Setzen: der gewünschte Abschwächungs-Algorithmus (Enum DistanceModelType). |
Rückgabewert
"linear", "inverse" oder "exponential".Beispiele
Standardwert auslesen und Modell setzen
const ctx = new AudioContext();
const panner = new PannerNode(ctx);
console.log(panner.distanceModel); // Standard
panner.distanceModel = 'linear';
panner.refDistance = 1;
panner.maxDistance = 50;
panner.rolloffFactor = 1;
console.log(panner.distanceModel);
Direkt im Konstruktor festlegen (Spiel mit fester Hörweite)
const ctx = new AudioContext();
const osc = new OscillatorNode(ctx, { frequency: 440 });
const panner = new PannerNode(ctx, {
panningModel: 'HRTF',
distanceModel: 'linear',
refDistance: 2,
maxDistance: 30,
rolloffFactor: 1,
positionX: 10,
positionY: 0,
positionZ: -5
});
osc.connect(panner).connect(ctx.destination);
document.querySelector('#play').addEventListener('click', async () => {
await ctx.resume();
osc.start();
osc.stop(ctx.currentTime + 2);
});
Verstärkung der drei Modelle berechnen und vergleichen
// Nachbildung der Formeln aus der Web-Audio-Spezifikation
const gain = (model, d, { ref = 1, max = 10000, rolloff = 1 } = {}) => {
switch (model) {
case 'linear': {
const dc = Math.min(Math.max(d, ref), max);
return 1 - Math.min(rolloff, 1) * (dc - ref) / (max - ref);
}
case 'inverse':
return ref / (ref + rolloff * (Math.max(d, ref) - ref));
case 'exponential':
return Math.pow(Math.max(d, ref) / ref, -rolloff);
}
};
for (const model of ['linear', 'inverse', 'exponential']) {
console.log(model, gain(model, 5, { max: 20 }).toFixed(3));
}
Modell zur Laufzeit per Auswahlfeld umschalten
const ctx = new AudioContext();
const panner = new PannerNode(ctx, { positionZ: -8 });
const select = document.querySelector('#distance-model');
select.addEventListener('change', (event) => {
panner.distanceModel = event.target.value;
console.log('Neues Modell:', panner.distanceModel);
});
// Wichtig · Fallstricke
- Ungültige Werte: Wird ein Wert außerhalb des Enums gesetzt (z. B.
"quadratic"), wird die Zuweisung ignoriert – ohne Fehlermeldung. Im Konstruktor-Options-Objekt führt ein ungültiger Wert dagegen zu einemTypeError. - Linear und
rolloffFactor: Beim Modell"linear"wirdrolloffFactorauf den Bereich 0–1 begrenzt; Werte größer als 1 haben keine zusätzliche Wirkung. refDistance= 0: Bei"inverse"und"exponential"führt das zu Division durch Null bzw. zu Stille;refDistancesollte daher immer positiv sein.- Die Entfernungsdämpfung gilt unabhängig von
panningModel("equalpower"oder"HRTF"). - Kompatibilität: In allen aktuellen Browsern unterstützt. Ältere Safari-Versionen brauchen ggf.
webkitAudioContext. DerAudioContextstartet erst nach einer Nutzerinteraktion (Autoplay-Richtlinie) – deshalb vorherctx.resume()aufrufen.