DOMMatrix: DOMMatrix() コンストラクター

DOMMatrix コンストラクターは、 4x4 の行列を表す新しい DOMMatrix オブジェクトを作成します。

構文

js
new DOMMatrix()
new DOMMatrix(init)

引数

init 省略可

作成したい行列を指定する数値の配列、あるいは CSS transform の文字列です。

数値の配列が渡された場合の動作は、配列の長さによって変わります。

  • [a, b, c, d, e, f] という形で 6 要素の配列を指定すると、指定された成分で初期化された 2D 行列が作成されます。
  • [m11, m12, m13, …, m42, m43, m44] という形で 16 要素の配列（列優先順）が指定された場合，指定された成分で初期化された 3D 行列が作成されます．

例

この例では、 Point.matrixTransform() を呼び出す際の引数として使用する DOMMatrix を作成しています。

js
const point = new DOMPoint(5, 4);
const scaleX = 2;
const scaleY = 3;
const translateX = 12;
const translateY = 8;
const angle = Math.PI / 2;
const matrix = new DOMMatrix([
  Math.cos(angle) * scaleX,
  Math.sin(angle) * scaleX,
  -Math.sin(angle) * scaleY,
  Math.cos(angle) * scaleY,
  translateX,
  translateY,
]);
const transformedPoint = point.matrixTransform(matrix);

仕様書

Specification
Geometry Interfaces Module Level 1
# dom-dommatrix-dommatrix

ブラウザーの互換性

BCD tables only load in the browser