DOMMatrixReadOnly: scale3d() 方法
注意:此功能在 Web Workers 中可用。
scale3d() 方法是 DOMMatrixReadOnly 介面的一個方法,它建立一個新矩陣,該矩陣是透過對當前矩陣應用 3D 縮放變換而得到的。它返回一個由原始 3D 矩陣根據指定的縮放因子(以指定的原點為中心)縮放而建立的新 DOMMatrix,預設原點為 (0, 0, 0)。原始矩陣不會被修改。
要邊進行 3D 縮放邊修改矩陣,請參閱 DOMMatrix.scale3dSelf()。
語法
js
scale3d()
scale3d(scale)
scale3d(scale, originX)
scale3d(scale, originX, originY)
scale3d(scale, originX, originY, originZ)
引數
scale-
乘數;縮放值。如果未提供縮放值,則預設為
1。 originX可選-
變換原點的 x 座標。如果未提供原點,則預設為
0。 originY可選-
變換原點的 y 座標。如果未提供原點,則預設為
0。 originZ可選-
變換原點的 z 座標。如果此值為
0(省略時的預設值),則結果矩陣可能不是 3D 的。
返回值
一個 DOMMatrix。
示例
js
const matrix = new DOMMatrix();
console.log(matrix.toString()); // no transforms applied
// matrix(1, 0, 0, 1, 0, 0)
console.log(matrix.scale3d(2).toString());
/* matrix3d(
2, 0, 0, 0,
0, 2, 0, 0,
0, 0, 2, 0,
0, 0, 0, 1) */
console.log(matrix.scale3d(0.5, 25, 25, 1.25).toString());
/* matrix3d(
0.5, 0, 0, 0,
0, 0.5, 0, 0,
0, 0, 0.5, 0, 1
2.5, 12.5, 0.625, 1) */
console.log(matrix.toString()); // original matrix is unchanged
// matrix(1, 0, 0, 1, 0, 0)
規範
| 規範 |
|---|
| Geometry Interfaces Module Level 1 # dom-dommatrixreadonly-scale3d |
瀏覽器相容性
載入中…
另見
DOMMatrix.scale3dSelf()DOMMatrixReadOnly.scale()- CSS
transform屬性以及scale3d()和matrix3d()函式 - CSS 變換模組
- SVG
transform屬性 CanvasRenderingContext2D介面的CanvasRenderingContext2D.transform()方法