Signatur
Beschreibung
Die schreibgeschützte Eigenschaft offset der Schnittstelle VREyeParameters gibt den Versatz vom Mittelpunkt zwischen den Augen des Benutzers zum Zentrum des linken bzw. rechten Auges an, gemessen in Metern. Der Wert ist ein Float32Array mit drei Komponenten [x, y, z].
Die x-Komponente entspricht dabei der halben Pupillendistanz (IPD): Beim linken Auge ist sie negativ, beim rechten positiv. y und z sind in der Praxis meist 0. Aus dem Betrag beider x-Werte lässt sich daher die gesamte IPD berechnen.
Man verwendet offset in stereoskopischen Renderern, um für jedes Auge eine eigene View-Matrix zu erzeugen: Die Kamera wird pro Auge um diesen Vektor verschoben, damit ein räumlicher Tiefeneindruck entsteht. Die Werte erhält man über VRDisplay.getEyeParameters("left") bzw. "right".
In WebVR 1.1 liefert VRDisplay.getFrameData() bereits fertige View-Matrizen (leftViewMatrix, rightViewMatrix), die den Augenversatz enthalten. offset ist daher vor allem für eigene Kameramodelle oder zur Anzeige der IPD nützlich.
Rückgabewert
[x, y, z] in Metern, das den Versatz des Augenzentrums vom Mittelpunkt zwischen den Augen beschreibt.Beispiele
Augenversatz auslesen und Pupillendistanz berechnen
// Nur in Browsern mit WebVR-Unterstützung lauffähig
const showIpd = async () => {
if (!navigator.getVRDisplays) {
console.log('WebVR wird nicht unterstützt');
return;
}
const [display] = await navigator.getVRDisplays();
if (!display) return;
const left = display.getEyeParameters('left');
const right = display.getEyeParameters('right');
console.log('Links:', Array.from(left.offset));
console.log('Rechts:', Array.from(right.offset));
const ipd = Math.abs(right.offset[0] - left.offset[0]);
console.log(`Pupillendistanz: ${(ipd * 1000).toFixed(1)} mm`);
};
showIpd();
Eigene View-Matrix pro Auge verschieben
// Verschiebt eine 4x4-Kameramatrix (Spaltenmajor) um den Augenversatz
const eyeViewMatrix = (cameraMatrix, eyeParams) => {
const [x, y, z] = eyeParams.offset;
const m = new Float32Array(cameraMatrix);
// View-Matrix = Inverse der Kamera: daher negativer Versatz
m[12] -= x;
m[13] -= y;
m[14] -= z;
return m;
};
const render = (display, camera) => {
for (const eye of ['left', 'right']) {
const params = display.getEyeParameters(eye);
const view = eyeViewMatrix(camera, params);
console.log(eye, view[12].toFixed(3));
}
};
Feature-Erkennung mit WebXR-Fallback
const detectVr = async () => {
if ('xr' in navigator) {
const ok = await navigator.xr.isSessionSupported('immersive-vr');
return ok ? 'WebXR' : 'keine VR';
}
if ('getVRDisplays' in navigator) return 'WebVR (veraltet)';
return 'keine VR';
};
detectVr().then(console.log);
// Wichtig · Fallstricke
- Veraltet: Die gesamte WebVR-API ist obsolet und wurde aus allen aktuellen Browsern entfernt bzw. war nur hinter Flags oder in Firefox und Samsung Internet verfügbar. Für neue Projekte die WebXR Device API verwenden – dort entspricht
XRView.transformbzw.XRView.viewMatrixdem Augenversatz. - Der Rückgabewert ist ein
Float32Array, kein normales Array – fürmapmit Nicht-Zahlen oder JSON-Ausgabe vorherArray.from()nutzen. - Die Werte können sich zur Laufzeit ändern, z. B. wenn der Benutzer die IPD am Headset einstellt. Nicht einmalig zwischenspeichern, sondern regelmäßig (etwa pro Frame oder bei
vrdisplaypresentchange) neu abfragen. - Die Einheit ist Meter – bei Szenen mit anderem Maßstab muss der Versatz entsprechend skaliert werden, sonst wirkt die Welt zu groß oder zu klein.
- Der Zugriff funktioniert nur in sicheren Kontexten (HTTPS) und teilweise nur nach Benutzerinteraktion.