The

interface represents 4x4 matrices, suitable for 2D and 3D operations.**DOMMatrix**

A 4x4 matrix is suitable to describe any rotation and translation in 3D.

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.*

`DOMMatrixReadOnly.multiplySelf()`

- Returns itself, a
`DOMMatrix`

, with its new content being the result of the original matrix being multiplied by the given`DOMMatrix`

. `DOMMatrixReadOnly.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

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|

Basic support | 61 | No | 33 | No | 48 | No |

Support in web workers | 61 | No | No | No | 48 | No |

`DOMMatrix()` constructor | 61 | No | 33 | No | 48 | No |

Feature | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
---|---|---|---|---|---|---|---|

Basic support | 61 | 61 | No | 33 | 48 | No | ? |

Support in web workers | 61 | 61 | No | No | 48 | No | ? |

`DOMMatrix()` constructor | 61 | 61 | No | 33 | 48 | No | ? |

## See also

- Its non-modifiable part,
`DOMMatrixReadOnly`

`SVGMatrix`

, the SVG matrix intended to be superseded by`DOMMatrix`

## Document Tags and Contributors

**Tags:**

**Contributors to this page:**connorshea, chrisdavidmills, jpmedley, K3N, zbjornson, tocretpa, jwhitlock, teoli, Matte_000, Jeree

**Last updated by:**connorshea,