SVGSVGElement: phương thức createSVGTransformFromMatrix()

Baseline Widely available

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

Phương thức createSVGTransformFromMatrix() của giao diện SVGSVGElement tạo một đối tượng SVGTransform bên ngoài bất kỳ cây tài liệu nào, dựa trên đối tượng DOMMatrix đã cho.

Cú pháp

js
createSVGTransformFromMatrix(matrix)

Tham số

matrix

Một đối tượng DOMMatrix biểu thị ma trận ban đầu cho phép biến đổi.

Giá trị trả về

Một đối tượng SVGTransform, được khởi tạo thành phép biến đổi ma trận đã cho. Đây là phép biến đổi matrix() nếu matrix2D, và là phép biến đổi matrix3d() trong các trường hợp khác.

Ví dụ

Tạo phép biến đổi từ ma trận

html
<svg id="exampleSVG" width="200" height="200">
  <rect id="exampleRect" x="50" y="50" width="100" height="50" fill="blue" />
</svg>
js
const svgElement = document.getElementById("exampleSVG");
const rectElement = document.getElementById("exampleRect");

// Tạo ma trận mới
const matrix = svgElement.createSVGMatrix();
matrix.a = 1; // Tỉ lệ x
matrix.d = 1; // Tỉ lệ y
matrix.e = 50; // Dịch chuyển x
matrix.f = 50; // Dịch chuyển y

// Tạo SVGTransform mới từ ma trận
const transform = svgElement.createSVGTransformFromMatrix(matrix);

// Áp dụng phép biến đổi cho hình chữ nhật
rectElement.transform.baseVal.appendItem(transform);

Thông số kỹ thuật

Thông số kỹ thuật
Scalable Vector Graphics (SVG) 2
# __svg__SVGSVGElement__createSVGTransformFromMatrix

Tương thích trình duyệt

Xem thêm