DOMMatrix: Methode setMatrixValue()
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 des DOMMatrix
-Interfaces ersetzt den Inhalt der Matrix durch die durch die angegebenen Transformation oder Transformationen beschriebene Matrix und gibt sich selbst zurück.
Syntax
setMatrixValue(transformList)
Parameter
transformList
-
Ein String. Sein Wert folgt der gleichen Syntax wie der Wert der CSS-Eigenschaft
transform
.
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 zurück in eine 2D-Transformation und anschließend zurück in eine 3D-Transformation mit einem weiteren Aufruf der setMatrixValue()
-Methode.
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
Siehe auch
DOMMatrix.translateSelf()
DOMMatrixReadOnly.is2D
- CSS
matrix()
Funktion - CSS
matrix3d()
Funktion