DOMMatrix: setMatrixValue() Methode

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

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

Die setMatrixValue() Methode der DOMMatrix Schnittstelle ersetzt den Inhalt der Matrix durch die durch die angegebenen Transformationen beschriebene Matrix und gibt sich selbst zurück.

Syntax

js
  DOMMatrix.setMatrixValue( transformList )

Parameter

transformList

Die Liste von kommagetrennten Transformationswerten als DOMString Matrix.

Rückgabewert

Gibt sich selbst zurück; die DOMMatrix mit aktualisierten Werten.

Beispiele

In diesem Beispiel erstellen wir eine Matrix, wenden eine 3D-Transformation mit der DOMMatrix.translateSelf() Methode an, setzen sie mit der setMatrixValue() Methode auf eine 2D-Transformation zurück und stellen sie anschließend mit einem weiteren setMatrixValue() Methodenaufruf wieder auf eine 3D-Transformation zurück.

js
const matrix = new DOMMatrix();

console.log(matrix.toString()); // matrix(1, 0, 0, 1, 0, 0)
console.log(matrix.is2D); // true

matrix.translateSelf(30, 40, 50);
console.log(matrix.toString()); // matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30, 40, 50, 1)
console.log(matrix.is2D); // false

matrix.setMatrixValue("matrix(1, 0, 0, 1, 15, 45)");
console.log(matrix.toString()); // output: matrix(1, 0, 0, 1, 15, 45)
console.log(matrix.is2D); // true

matrix.setMatrixValue(
  "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30, 40, 50, 1)",
);
console.log(matrix.toString()); // matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30, 40, 50, 1)
console.log(matrix.is2D); // false

Spezifikationen

Specification
Geometry Interfaces Module Level 1
# dom-dommatrix-setmatrixvalue

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch