DOMMatrix()

Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The DOMMatrix constructor creates a new DOMMatrix object which represents 4x4 matrices, suitable for 2D and 3D operations..

Syntax

var domMatrix = new DOMMatrix([init])

Parameters

init Optional
A string containing a sequence of numbers or an array of numbers specifying the matrix you want to create, or a CSS transform string.

Example

This example creates a DOMMatrix to use as an argument for calling Point.matrixTransform().

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

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
DOMMatrix() constructorChrome Full support 45Edge No support NoFirefox Full support 33IE No support NoOpera Full support 32Safari Full support 11WebView Android Full support 61Chrome Android Full support 45Firefox Android Full support 33Opera Android Full support 32Safari iOS Full support 11Samsung Internet Android ?

Legend

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