この記事はまだボランティアによって 日本語 に翻訳されていません。ぜひ MDN に参加して翻訳を手伝ってください!
この記事を English (US) で読むこともできます。

The DOMMatrix interface represents 4x4 matrices, suitable for 2D and 3D operations including rotation and translation.

This interface should be available inside Web workers, though some implementations don't allow it yet.

Constructor

DOMMatrix()
Creates a new DOMMatrix object.

Properties

This interface inherits properties from DOMMatrixReadOnly, though some are modified not to be read-only.

is2D Read only
A boolean flag set to true if current matrix was initialized as a 2D matrix
isIdentity Read only
A boolean flag returning true if the current matrix is identity.
m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44
Are double representing each component of a 4x4 matrix.
a, b, c, d, e, f
Are double representing each component of a 4x4 matrix needed for 2D rotations and translations. They are aliases for some components of the 4x4 matrix:
2D 3D equivalent
a m11
b m12
c m21
d m22
e m41
f m42

Methods

This interface inherits methods from DOMMatrixReadOnly.

fromMatrix()
Creates a new mutable DOMMatrix object given an existing matrix or a DOMMatrixInit dictionary which provides the values for its properties.
DOMMatrix.multiplySelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being multiplied by the given DOMMatrix.
DOMMatrix.preMultiplySelf()
Returns itself, a DOMMatrix, with its new content being the result of the given DOMMatrix being multiplied by the original matrix.
DOMMatrix.translateSelf()
Returns itself, a DOMMatrix, with its new content being the result of the matrix being translated by the given vector.
DOMMatrix.scaleSelf()
Returns itself, a DOMMatrix, with its new content being the result of the matrix x and y dimensions being scaled by the given factor, centered on the origin given.
DOMMatrix.scale3dSelf()
Returns itself, a DOMMatrix, with its new content being the result of the matrix x, y and z dimension being scaled by the given factor, centered on the origin given.
DOMMatrix.scaleNonUniformSelf()
Returns itself, a DOMMatrix, with its new content being the result of the matrix x, y and z dimension being scaled by the given factor for each dimension, centered on the origin given.
DOMMatrix.rotateSelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being rotated by the given angle, with the rotation centered on the origin given.
DOMMatrix.rotateFromVectorSelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being rotated by the angle between the given vector and (1,0), centered on the origin given.
DOMMatrix.rotateAxisAngleSelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being rotated by the given angle and the give vector.
DOMMatrix.skewXSelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being skewed along the x-axis by the given factor.
DOMMatrix.skewYSelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being skewed along the y-axis by the given factor.
DOMMatrix.invertSelf()
Returns itself, a DOMMatrix, with its new content being the result of the original matrix being inverted. If the matrix cannot be inverted, all its components are set to NaN and is2D() returns false.
DOMMatrix.setMatrixValue()
Returns itself, a DOMMatrix, with its describing the matrix representing the same transformation as the CSS transform functions given in parameter.

Specifications

Specification Status Comment
Geometry Interfaces Module Level 1
The definition of 'DOMMatrix' in that specification.
Candidate Recommendation Initial definition

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
DOMMatrixChrome Full support 61Edge No support NoFirefox Full support 33IE No support NoOpera Full support 48Safari Full support 11WebView Android Full support 61Chrome Android Full support 61Firefox Android Full support 33Opera Android Full support 45Safari iOS Full support 11Samsung Internet Android ?
Support in web workersChrome Full support 61Edge No support NoFirefox No support NoIE No support NoOpera Full support 48Safari Full support 11WebView Android Full support 61Chrome Android Full support 61Firefox Android No support NoOpera Android Full support 45Safari iOS Full support 11Samsung Internet Android ?
DOMMatrix() constructorChrome Full support 61Edge No support NoFirefox Full support 33IE No support NoOpera Full support 48Safari Full support 11WebView Android Full support 61Chrome Android Full support 61Firefox Android Full support 33Opera Android Full support 45Safari iOS Full support 11Samsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown

See also

ドキュメントのタグと貢献者

最終更新者: SaschaNaz,