← 返回首页

DOMMatrix: setMatrixValue() メソッド - Web API | MDN

Toggle sidebar

Theme

OS default
Light
Dark

日本語

Remember language Learn more

DOMMatrix: setMatrixValue() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年1月.

メモ: この機能はウェブワーカー内で利用可能です。

setMatrixValue() は DOMMatrix インターフェイスのメソッドで、指定された座標変換または一連の座標変換によって記述される行列で、行列の内容を置き換え、自分自身を返します。

In this article

構文

js

setMatrixValue(transformList)

引数

文字列です。この値は CSS の transform プロパティ値と同じ構文に従います。

返値

自分自身を返します。更新された値の DOMMatrix です。

例

この例では、行列を作成し、DOMMatrix.translateSelf() メソッドを使用して三次元変換を適用し、setMatrixValue() メソッドを使用して二次元変換に戻し、さらに別の setMatrixValue() メソッド呼び出しで再び三次元変換に戻します。

js
const matrix = new DOMMatrix();

console.log(matrix.toString()); // matrix(1, 0, 0, 1, 0, 0)
console.log(matrix.is2D); // true

matrix.translateSelf(30, 40, 50);
console.log(matrix.toString()); // matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30, 40, 50, 1)
console.log(matrix.is2D); // false

matrix.setMatrixValue("matrix(1, 0, 0, 1, 15, 45)");
console.log(matrix.toString()); // 出力: matrix(1, 0, 0, 1, 15, 45)
console.log(matrix.is2D); // true

matrix.setMatrixValue(
  "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30, 40, 50, 1)",
);
console.log(matrix.toString()); // matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 30, 40, 50, 1)
console.log(matrix.is2D); // false

仕様書

Specification

Geometry Interfaces Module Level 1
# dom-dommatrix-setmatrixvalue

ブラウザーの互換性

Enable JavaScript to view this browser compatibility table.

関連情報

Help improve MDN

Was this page helpful to you?

Yes No

Learn how to contribute

This page was last modified on 2026年2月20日 by MDN contributors.

View this page on GitHub • Report a problem with this content