Hinweis: Diese Funktion ist in Web Workers verfügbar.

Der DOMMatrix()-Konstruktor erstellt ein neues DOMMatrix-Objekt, das eine 4x4-Matrix darstellt und für 2D- und 3D-Operationen geeignet ist.

Syntax

new DOMMatrix()
new DOMMatrix(initString)
new DOMMatrix(initArray)

Parameter

initString Optional

Ein String, der eine 2D- oder 3D-Matrix im CSS-Format matrix() oder matrix3d() darstellt.

initArray Optional

Ein Array, das entweder 6 oder 16 Zahlen im spalten-major Orden enthält. Andere Array-Längen werfen einen TypeError.

• Ein Array mit 6 Elementen wird als die Matrixkomponenten [m11, m12, m21, m22, m41, m42] interpretiert und erstellt eine 2D-Matrix.
• Ein Array mit 16 Elementen wird als die Matrixkomponenten [m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44] interpretiert und erstellt eine 3D-Matrix.

Wenn dieses Argument weggelassen wird, wird eine Einheitsmatrix erstellt, d.h. äquivalent zu [1, 0, 0, 1, 0, 0].

Wenn dieses Argument als Float32Array oder Float64Array angegeben wird, sollten Sie die leistungsfähigeren statischen Methoden DOMMatrix.fromFloat32Array() oder DOMMatrix.fromFloat64Array() stattdessen in Betracht ziehen.

Rückgabewert

Ein neues DOMMatrix-Objekt.

Ausnahmen

TypeError

Wird geworfen, wenn das Argument kein String oder ein Array mit einer anderen Länge als 6 oder 16 ist.

SyntaxError

Wird geworfen, wenn das String-Argument nicht im gültigen CSS-Format matrix() oder matrix3d() ist.

Beispiele

Dieses Beispiel erstellt eine DOMMatrix, um sie als Argument für den Aufruf von DOMPointReadOnly.matrixTransform() zu verwenden.

const point = new DOMPoint(5, 4);
const scaleX = 2;
const scaleY = 3;
const translateX = 12;
const translateY = 8;
const angle = Math.PI / 2;
const matrix = new DOMMatrix([
  Math.cos(angle) * scaleX,
  Math.sin(angle) * scaleX,
  -Math.sin(angle) * scaleY,
  Math.cos(angle) * scaleY,
  translateX,
  translateY,
]);
const transformedPoint = point.matrixTransform(matrix);

Spezifikationen

Browser-Kompatibilität

Siehe auch

• DOMMatrix.fromFloat32Array()
• DOMMatrix.fromFloat64Array()
• DOMMatrix.fromMatrix()