XRRigidTransform: matrix-Eigenschaft

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Die schreibgeschützte XRRigidTransform-Eigenschaft matrix gibt die Transformationsmatrix zurück, die durch das Objekt repräsentiert wird. Die zurückgegebene Matrix kann dann mit einem Spaltenvektor vor multipliziert werden, um den Vektor mit der 3D-Rotation, die durch die orientation angegeben wird, zu rotieren und dann mit der position zu übersetzen.

Wert

Ein Float32Array mit 16 Einträgen, das die 4x4-Transformationsmatrix darstellt, die durch die position- und orientation-Eigenschaften beschrieben wird.

Anwendungshinweise

Matrixformat

Alle 4x4-Transformationsmatrizen, die in WebGL verwendet werden, sind in 16-Element-Float32Arrays gespeichert. Die Werte werden in Spalten-Major-Ordnung in das Array eingefügt; das heißt, jede Spalte wird von oben nach unten in das Array geschrieben, bevor zur nächsten Spalte rechts gewechselt und diese in das Array geschrieben wird. Daher sieht die Matrix für das Array [a0, a1, a2, …, a13, a14, a15] so aus:

[a0a4a8a12a1a5a9a13a2a6a10a14a3a7a11a15]\begin{bmatrix} a[0] & a[4] & a[8] & a[12]\\ a[1] & a[5] & a[9] & a[13]\\ a[2] & a[6] & a[10] & a[14]\\ a[3] & a[7] & a[11] & a[15]\\ \end{bmatrix}

Bei der ersten Anfrage wird die matrix berechnet. Danach sollte sie aus Leistungsgründen zwischengespeichert werden.

Erstellen der Matrix

In diesem Abschnitt, der sich an fortgeschrittene Leser richtet, erläutern wir, wie die API die Matrix für die angegebene Transformation berechnet. Es beginnt mit der Zuweisung einer neuen Matrix und dem Schreiben einer 4x4-Einheitsmatrix in diese:

[1000010000100001]\begin{bmatrix} 1 & 0 & 0 & 0\\ 0 & 1 & 0 & 0\\ 0 & 0 & 1 & 0\\ 0 & 0 & 0 & 1 \end{bmatrix}

Dies ist eine Transformation, die weder die Orientierung noch die Position eines Punktes, Vektors oder Objekts, auf das sie angewendet wird, verändert.

Anschließend wird die position in die rechte Spalte eingefügt, wie hier dargestellt, was zu einer Translationsmatrix führt, die ein Koordinatensystem um die angegebene Entfernung in jeder Dimension transformiert, ohne dass eine rotatorische Änderung erfolgt. Hierbei sind px, py und pz die Werte der x-, y- und z-Mitglieder von DOMPointReadOnly position.

[100px010py001pz0001]\begin{bmatrix} 1 & 0 & 0 & x\\ 0 & 1 & 0 & y\\ 0 & 0 & 1 & z\\ 0 & 0 & 0 & 1 \end{bmatrix}

Dann wird eine Rotationsmatrix erstellt, indem eine Spaltenvektor-Rotationsmatrix aus dem Einheitsquaternion erstellt wird, das durch orientation angegeben ist:

[1-2(qy2+qz2)2(qxqy-qzqw)2(qxqz+qyqw)02(qxqy+qzqw)1-2(qx2+qz2)2(qyqz-qxqw)02(qxqz-qyqw)2(qyqz+qxqw)1-2(qx2+qy2)00001]\begin{bmatrix} 1 - 2(q_y^2 + q_z^2) & 2(q_xq_y - q_zq_w) & 2(q_xq_z + q_yq_w) & p_x\\ 2(q_xq_y + q_zq_w) & 1 - 2(q_x^2 + q_z^2) & 2(q_yq_z - q_xq_w) & p_y\\ 2(q_xq_z - q_yq_w) & 2(q_yq_z + q_xq_w) & 1 - 2(q_x^2 + q_y^2) & p_z\\ 0 & 0 & 0 & 1 \end{bmatrix}

Die endgültige Transformationsmatrix wird berechnet, indem die Translationsmatrix mit der Rotationsmatrix multipliziert wird, in der Reihenfolge (translation * rotation). Dies ergibt die endgültige Transformationsmatrix, wie sie von matrix zurückgegeben wird:

[1-2(qy2+qz2)2(qxqy-qzqw)2(qxqz+qyqw)px2(qxqy+qzqw)1-2(qx2+qz2)2(qyqz-qxqw)py2(qxqz-qyqw)2(qyqz+qxqw)1-2(qx2+qy2)pz0001]\begin{bmatrix} 1 - 2(q_y^2 + q_z^2) & 2(q_xq_y - q_zq_w) & 2(q_xq_z + q_yq_w) & p_x\\ 2(q_xq_y + q_zq_w) & 1 - 2(q_x^2 + q_z^2) & 2(q_yq_z - q_xq_w) & p_y\\ 2(q_xq_z - q_yq_w) & 2(q_yq_z + q_xq_w) & 1 - 2(q_x^2 + q_y^2) & p_z\\ 0 & 0 & 0 & 1 \end{bmatrix}

Beispiele

In diesem Beispiel wird eine Transformation erstellt, um eine Matrix zu generieren, die während des Renderings von WebGL-Objekten als Transformation verwendet werden kann, um Objekte so zu platzieren, dass sie einem bestimmten Versatz und einer bestimmten Ausrichtung entsprechen. Die matrix wird dann an eine Bibliotheksfunktion übergeben, die WebGL verwendet, um ein Objekt mit dem angegebenen Namen unter Verwendung der angegebenen Transformationsmatrix zu rendern, um es zu positionieren und auszurichten.

js
let transform = new XRRigidTransform(
  { x: 0, y: 0.5, z: 0.5 },
  { x: 0, y: -0.5, z: -0.5, w: 1 },
);
drawGLObject("magic-lamp", transform.matrix);

Spezifikationen

Specification
WebXR Device API
# dom-xrrigidtransform-matrix

Browser-Kompatibilität

BCD tables only load in the browser