SVGTransform: setMatrix()-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.

Die setMatrix()-Methode der SVGTransform-Schnittstelle setzt den Transformationstyp auf SVG_TRANSFORM_MATRIX, wobei der Parameter matrix die neue Transformation definiert.

Beachten Sie, dass die Werte des Parameters matrix kopiert werden, was bedeutet, dass Änderungen am matrix-Objekt nach dem Aufruf dieser Methode die Transformation nicht beeinflussen.

Syntax

js
SVGTransform.setMatrix(matrix)

Parameter

matrix

Ein live DOMMatrix-Objekt, das die anzuwendende neue Transformationsmatrix definiert.

Rückgabewert

Keiner (undefined).

Ausnahmen

NoModificationAllowedError DOMException

Wird ausgelöst, wenn das Attribut oder das SVGTransform-Objekt schreibgeschützt ist.

Beispiele

Setzen einer Transformationsmatrix

js
// Get an SVG element and create a transform object
const svgElement = document.querySelector("svg");
const transform = svgElement.createSVGTransform();

// Create a DOMMatrix with specific values
const matrix = new DOMMatrix();
matrix.a = 1; // Scale X
matrix.d = 1; // Scale Y
matrix.e = 50; // Translate X
matrix.f = 50; // Translate Y

// Set the transform to the new matrix
transform.setMatrix(matrix);

console.dir(transform.matrix); // Output: SVGMatrix { a: 1, b: 0, c: 0, d: 1, e: 50, f: 50 }

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# __svg__SVGTransform__setMatrix

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch