SVGGraphicsElement: getScreenCTM() 方法

Baseline 已廣泛支援

此特性已相當成熟，可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來，各瀏覽器均已提供此特性。

getScreenCTM() 方法是 SVGGraphicsElement 介面的一部分，它表示將當前元素的座標系轉換到 SVG 文件片段的 SVG 視口的座標系的矩陣。

語法

getScreenCTM()

引數

無。

返回值

一個 DOMMatrix 物件。

示例

獲取螢幕變換矩陣

html

<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400">
  <!-- Circle with translation and scale -->
  <circle
    id="circle"
    cx="50"
    cy="50"
    r="30"
    fill="blue"
    transform="translate(100, 150) scale(2)" />
</svg>

const circle = document.getElementById("circle");

// Get the current screen transformation matrix
const screenCTM = circle.getScreenCTM();

console.log("Screen transformation matrix:");
console.log(
  `a: ${screenCTM.a}, b: ${screenCTM.b}, c: ${screenCTM.c}, d: ${screenCTM.d}, e: ${screenCTM.e}, f: ${screenCTM.f}`,
);
// Output: a: 2, b: 0, c: 0, d: 2, e: 100, f: 150

規範

規範
Scalable Vector Graphics (SVG) 2 # __svg__SVGGraphicsElement__getScreenCTM

瀏覽器相容性

幫助改進 MDN

瞭解如何貢獻

此頁面最後修改於 ⁨2025年2月2日⁩，由 MDN 貢獻者更新。

在 GitHub 上檢視此頁面 • 報告此內容的問題