Widely available Supported across all major browsers. Safe to use in production.

DOM Geometry

The DOMMatrix interface represents 4×4 matrices, suitable for 2D and 3D operations including rotation and translation. It is a mutable version of the DOMMatrixReadOnly interface. The interface is available inside web workers.

WebKitCSSMatrix and SVGMatrix are aliases to DOMMatrix.

DOMMatrixReadOnly DOMMatrix

DOM

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
DOMMatrix
61
79
33
11
61
11
a

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
b

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
c

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
d

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
DOMMatrix

The DOMMatrix() constructor creates a new DOMMatrix object which represents a 4x4 matrix, suitable for 2D and 3D operations.
61
79
33
11
61
11
e

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
f

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
fromFloat32Array_static

The fromFloat32Array() static method of the DOMMatrix interface creates a new DOMMatrix object given an array of single-precision (32-bit) floating-point values.
61
79
69
11
61
11
fromFloat64Array_static

The fromFloat64Array() static method of the DOMMatrix interface creates a new DOMMatrix object given an array of double-precision (64-bit) floating-point values.
61
79
69
11
61
11
fromMatrix_static

The fromMatrix() static method of the DOMMatrix interface creates a new DOMMatrix object given an existing matrix or an object which provides the values for its properties.
61
79
69
11
61
11
invertSelf

The invertSelf() method of the DOMMatrix interface inverts the original matrix. If the matrix cannot be inverted, the new matrix's components are all set to NaN and its DOMMatrixReadOnly.is2D property is set to false.
61
79
33
11
61
11
m11

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m12

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m13

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m14

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m21

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m22

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m23

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m24

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m31

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m32

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m33

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m34

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m41

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m42

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m43

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
m44

This interface inherits properties from DOMMatrixReadOnly, though some of these properties are altered to be mutable.
61
79
33
11
61
11
multiplySelf

The multiplySelf() method of the DOMMatrix interface multiplies a matrix by the otherMatrix parameter, computing the dot product of the original matrix and the specified matrix: A⋅B. If no matrix is specified as the multiplier, the matrix is multiplied by a matrix in which every element is 0 except the bottom-right corner and the element immediately above…
61
79
33
11
61
11
preMultiplySelf

The preMultiplySelf() method of the DOMMatrix interface modifies the matrix by pre-multiplying it with the specified DOMMatrix. This is equivalent to the dot product B⋅A, where matrix A is the source matrix and B is the matrix given as an input to the method. If no matrix is specified as the multiplier, the matrix is multiplied by a matrix in which every…
61
79
33
11
61
11
rotateAxisAngleSelf

The rotateAxisAngleSelf() method of the DOMMatrix interface is a transformation method that rotates the source matrix by the given vector and angle, returning the altered matrix.
61
79
33
11
61
11
rotateFromVectorSelf

The rotateFromVectorSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix by rotating the matrix by the angle between the specified vector and (1, 0). The rotation angle is determined by the angle between the vector (1,0)T and (x,y)T in the clockwise direction, or (+/-)arctan(y/x). If x and y are both 0, the…
61
79
33
11
61
11
rotateSelf

The rotateSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix. It rotates the source matrix around each of its axes by the specified number of degrees and returns the rotated matrix.
61
79
33
11
61
11
scale3dSelf

The scale3dSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix by applying a specified scaling factor to all three axes, centered on the given origin, with a default origin of (0, 0, 0), returning the 3D-scaled matrix.
61
79
33
11
61
11
scaleSelf

The scaleSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix by applying a specified scaling factor, centered on the given origin, with a default origin of (0, 0), returning the scaled matrix.
61
79
33
11
61
11
setMatrixValue

The setMatrixValue() method of the DOMMatrix interface replaces the contents of the matrix with the matrix described by the specified transform or transforms, returning itself.
61
79
33
11
61
11
skewXSelf

The skewXSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix. It skews the source matrix by applying the specified skew transformation along the X-axis and returns the skewed matrix.
61
79
33
11
61
11
skewYSelf

The skewYSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix. It skews the source matrix by applying the specified skew transformation along the Y-axis and returns the skewed matrix.
61
79
33
11
61
11
translateSelf

The translateSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix. It applies the specified vectors and returns the updated matrix. The default vector is [0, 0, 0].
61
79
33
11
61
11
worker_support

Available in workers
61
79
69
11
61
11
DOMMatrixReadOnly

The DOMMatrixReadOnly interface represents a read-only 4×4 matrix, suitable for 2D and 3D operations. The DOMMatrix interface — which is based upon DOMMatrixReadOnly—adds mutability, allowing you to alter the matrix after creating it.
61
79
33
11
61
11
a

This interface doesn't inherit any properties.
61
79
33
11
61
11
b

This interface doesn't inherit any properties.
61
79
33
11
61
11
c

This interface doesn't inherit any properties.
61
79
33
11
61
11
d

This interface doesn't inherit any properties.
61
79
33
11
61
11
DOMMatrixReadOnly

The DOMMatrixReadOnly() constructor creates a new DOMMatrixReadOnly object which represents a 4x4 matrix, suitable for 2D and 3D operations.
61
79
62
11
61
11
e

This interface doesn't inherit any properties.
61
79
33
11
61
11
f

This interface doesn't inherit any properties.
61
79
33
11
61
11
flipX

The flipX() method of the DOMMatrixReadOnly interface creates a new matrix being the result of the original matrix flipped about the x-axis. This is equivalent to multiplying the matrix by DOMMatrix(-1, 0, 0, 1, 0, 0). The original matrix is not modified.
61
79
33
11
61
11
flipY

The flipY() method of the DOMMatrixReadOnly interface creates a new matrix being the result of the original matrix flipped about the y-axis. This is equivalent to multiplying the matrix by DOMMatrix(1, 0, 0, -1, 0, 0). The original matrix is not modified.
61
79
33
11
61
11
fromFloat32Array_static

The fromFloat32Array() static method of the DOMMatrixReadOnly interface creates a new DOMMatrixReadOnly object given an array of single-precision (32-bit) floating-point values.
61
79
69
11
61
11
fromFloat64Array_static

The fromFloat64Array() static method of the DOMMatrixReadOnly interface creates a new DOMMatrixReadOnly object given an array of double-precision (64-bit) floating-point values.
61
79
69
11
61
11
fromMatrix_static

The fromMatrix() static method of the DOMMatrixReadOnly interface creates a new DOMMatrixReadOnly object given an existing matrix or an object which provides the values for its properties.
61
79
69
11
61
11
inverse

The inverse() method of the DOMMatrixReadOnly interface creates a new matrix which is the inverse of the original matrix. If the matrix cannot be inverted, the new matrix's components are all set to NaN and its DOMMatrixReadOnly.is2D property is set to false. The original matrix is not changed.
61
79
33
11
61
11
is2D

The readonly is2D property of the DOMMatrixReadOnly interface is a Boolean flag that is true when the matrix is 2D. The value is true if the matrix was initialized as a 2D matrix and only 2D transformation operations were applied. Otherwise, the matrix is defined in 3D, and is2D is false.
61
79
33
11
61
11
isIdentity

The readonly isIdentity property of the DOMMatrixReadOnly interface is a Boolean whose value is true if the matrix is the identity matrix.
61
79
59
11
61
11
m11

This interface doesn't inherit any properties.
61
79
33
11
61
11
m12

This interface doesn't inherit any properties.
61
79
33
11
61
11
m13

This interface doesn't inherit any properties.
61
79
33
11
61
11
m14

This interface doesn't inherit any properties.
61
79
33
11
61
11
m21

This interface doesn't inherit any properties.
61
79
33
11
61
11
m22

This interface doesn't inherit any properties.
61
79
33
11
61
11
m23

This interface doesn't inherit any properties.
61
79
33
11
61
11
m24

This interface doesn't inherit any properties.
61
79
33
11
61
11
m31

This interface doesn't inherit any properties.
61
79
33
11
61
11
m32

This interface doesn't inherit any properties.
61
79
33
11
61
11
m33

This interface doesn't inherit any properties.
61
79
33
11
61
11
m34

This interface doesn't inherit any properties.
61
79
33
11
61
11
m41

This interface doesn't inherit any properties.
61
79
33
11
61
11
m42

This interface doesn't inherit any properties.
61
79
33
11
61
11
m43

This interface doesn't inherit any properties.
61
79
33
11
61
11
m44

This interface doesn't inherit any properties.
61
79
33
11
61
11
multiply

The multiply() method of the DOMMatrixReadOnly interface creates and returns a new matrix which is the dot product of the matrix and the otherMatrix parameter. If otherMatrix is omitted, the matrix is multiplied by a matrix in which every element is 0 except the bottom-right corner and the element immediately above and to its left: m33 and m34. These have…
61
79
33
11
61
11
rotate

The rotate() method of the DOMMatrixReadOnly interface returns a new DOMMatrix created by rotating the source matrix around each of its axes by the specified number of degrees. The original matrix is not altered.
61
79
33
11
61
11
rotateAxisAngle

The rotateAxisAngle() method of the DOMMatrixReadOnly interface returns a new DOMMatrix created by rotating the source matrix by the given vector and angle. The original matrix is not altered.
61
79
33
11
61
11
rotateFromVector

The rotateFromVector() method of the DOMMatrixReadOnly interface is returns a new DOMMatrix created by rotating the source matrix by the angle between the specified vector and (1, 0). The rotation angle is determined by the angle between the vector (1,0)T and (x,y)T in the clockwise direction, or (+/-)arctan(y/x). If x and y are both 0, the angle is…
61
79
33
11
61
11
scale

The scale() method of the DOMMatrixReadOnly interface creates a new matrix being the result of the original matrix with a scale transform applied.
61
79
33
11
61
11
scale3d

The scale3d() method of the DOMMatrixReadOnly interface creates a new matrix which is the result of a 3D scale transform being applied to the matrix. It returns a new DOMMatrix created by scaling the source 3d matrix by the given scale factor centered on the origin point specified by the origin parameters, with a default origin of (0, 0, 0). The original…
61
79
33
11
61
11
skewX

The skewX() method of the DOMMatrixReadOnly interface returns a new DOMMatrix created by applying the specified skew transformation to the source matrix along its x-axis. The original matrix is not modified.
61
79
33
11
61
11
skewY

The skewY() method of the DOMMatrixReadOnly interface returns a new DOMMatrix created by applying the specified skew transformation to the source matrix along its y-axis. The original matrix is not modified.
61
79
33
11
61
11
toFloat32Array

The toFloat32Array() method of the DOMMatrixReadOnly interface returns a new Float32Array containing all 16 elements (m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44) which comprise the matrix. The elements are stored into the array as single-precision floating-point numbers in column-major (colexographical access, or "colex")…
61
79
33
11
61
11
toFloat64Array

The toFloat64Array() method of the DOMMatrixReadOnly interface returns a new Float64Array containing all 16 elements (m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44) which comprise the matrix. The elements are stored into the array as double-precision floating-point numbers in column-major (colexographical access, or "colex")…
61
79
33
11
61
11
toJSON

The toJSON() method of the DOMMatrixReadOnly interface creates and returns a JSON object. The JSON object includes the 2D matrix elements a through f, the 16 elements of the 4X4 3D matrix, m[1-4][1-4], the boolean DOMMatrixReadOnly.is2D property, and the boolean DOMMatrixReadOnly.isIdentity property.
61
79
62
11
61
11
toString

The toString() stringifier of the DOMMatrixReadOnly interface returns the value of the matrix as a string in the form of a matrix() or matrix3d() CSS transform function; comma-separated lists of 6 or 16 coordinate values, prepended by "matrix( or "matrix3d( respectively, appended by )".
61
79
33
11
61
11
transformPoint

The transformPoint method of the DOMMatrixReadOnly interface creates a new DOMPoint object, transforming a specified point by the matrix. Neither the matrix nor the original point are altered.
61
79
33
11
61
11
translate

The translate() method of the DOMMatrixReadOnly interface creates a new matrix being the result of the original matrix with a translation applied.
61
79
33
11
61
11
worker_support

Available in workers
61
79
69
11
61
11
DOMPoint

A DOMPoint object represents a 2D or 3D point in a coordinate system; it includes values for the coordinates in up to three dimensions, as well as an optional perspective value. DOMPoint is based on DOMPointReadOnly but allows its properties' values to be changed.
61
79
31
10.1
61
10.3
DOMPoint

The DOMPoint() constructor creates and returns a new DOMPoint object, given the values for some or all of its properties.
61
79
31
10.1
61
10.3
fromPoint_static

The fromPoint() static method of the DOMPoint interface creates and returns a new mutable DOMPoint object given a source point.
61
79
62
10.1
61
10.3
w

The DOMPoint interface's w property holds the point's perspective value, w, for a point in space.
61
79
31
10.1
61
10.3
worker_support

Available in workers
61
79
69
10.1
61
10.3
x

The DOMPoint interface's x property holds the horizontal coordinate, x, for a point in space.
61
79
31
10.1
61
10.3
y

The DOMPoint interface's y property holds the vertical coordinate, y, for a point in space.
61
79
31
10.1
61
10.3
z

The DOMPoint interface's z property specifies the depth coordinate of a point in space.
61
79
31
10.1
61
10.3
DOMPointReadOnly

The DOMPointReadOnly interface specifies the coordinate and perspective fields used by DOMPoint to define a 2D or 3D point in a coordinate system.
61
79
31
10.1
61
10.3
DOMPointReadOnly

The DOMPointReadOnly() constructor returns a new DOMPointReadOnly object representing a point in 2D or 3D space, optionally with perspective, whose values cannot be altered by script code.
61
79
62
10.1
61
10.3
fromPoint_static

The static DOMPointReadOnly method fromPoint() creates and returns a new DOMPointReadOnly object given a source point.
61
79
62
10.1
61
10.3
matrixTransform

The matrixTransform() method of the DOMPointReadOnly interface applies a matrix transform specified as an object to the DOMPointReadOnly object, creating and returning a new DOMPointReadOnly object. Neither the matrix nor the point are altered.
61
79
69
11
61
11
toJSON

The DOMPointReadOnly method toJSON() returns an object giving the JSON form of the point object.
61
79
62
10.1
61
10.3
w

The DOMPointReadOnly interface's w property holds the point's perspective value, w, for a read-only point in space.
61
79
31
10.1
61
10.3
worker_support

Available in workers
61
79
69
10.1
61
10.3
x

The DOMPointReadOnly interface's x property holds the horizontal coordinate, x, for a read-only point in space. This property cannot be changed by JavaScript code in this read-only version of the DOMPoint object.
61
79
31
10.1
61
10.3
y

The DOMPointReadOnly interface's y property holds the vertical coordinate, y, for a read-only point in space.
61
79
31
10.1
61
10.3
z

The DOMPointReadOnly interface's z property holds the depth coordinate, z, for a read-only point in space.
61
79
31
10.1
61
10.3
DOMQuad

A DOMQuad is a collection of four DOMPoints defining the corners of an arbitrary quadrilateral. Returning DOMQuads lets getBoxQuads() return accurate information even when arbitrary 2D or 3D transforms are present. It has a handy bounds attribute returning a DOMRectReadOnly for those cases where you just want an axis-aligned bounding rectangle.
61
79
31
11
61
11
DOMQuad

The DOMQuad() constructor creates and returns a new DOMQuad object, given the values for some or all of its properties.
61
79
31
11
61
11
fromQuad_static

The fromQuad() static method of the DOMQuad interface returns a new DOMQuad object based on the provided set of coordinates in the shape of another DOMQuad object.
61
79
69
11
61
11
fromRect_static

The fromRect() static method of the DOMQuad interface returns a new DOMQuad object based on the provided set of coordinates in the shape of a DOMRect object.
61
79
69
11
61
11
getBounds

The DOMQuad method getBounds() returns a DOMRect object representing the smallest rectangle that fully contains the DOMQuad object.
61
79
62
11
61
11
p1

The DOMQuad interface's p1 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect_static, it is the point (x, y).
61
79
31
11
61
11
p2

The DOMQuad interface's p2 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect_static, it is the point (x + width, y).
61
79
31
11
61
11
p3

The DOMQuad interface's p3 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect_static, it is the point (x + width, y + height).
61
79
31
11
61
11
p4

The DOMQuad interface's p4 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect_static, it is the point (x, y + height).
61
79
31
11
61
11
toJSON

The DOMQuad method toJSON() returns a JSON representation of the DOMQuad object.
61
79
62
11
61
11
worker_support

Available in workers
61
79
69
11
61
11
DOMRect

A DOMRect describes the size and position of a rectangle.
61
79
27
10.1
61
10.3
DOMRect

The DOMRect() constructor creates a new DOMRect object.
61
79
31
10.1
61
10.3
fromRect_static

The fromRect() static method of the DOMRect object creates a new DOMRect object with a given location and dimensions.
61
79
69
10.1
61
10.3
height

The height property of the DOMRect interface represents the height of the rectangle. The value can be negative.
2
12
3
4
18
3.2
width

The width property of the DOMRect interface represents the width of the rectangle. The value can be negative.
2
12
3
4
18
3.2
worker_support

Available in workers
61
79
69
10.1
61
10.3
x

The x property of the DOMRect interface represents the x-coordinate of the rectangle, which is the horizontal distance between the viewport's left edge and the rectangle's origin.
61
79
31
10.1
61
10.3
y

The y property of the DOMRect interface represents the y-coordinate of the rectangle, which is the vertical distance between the viewport's top edge and the rectangle's origin.
61
79
31
10.1
61
10.3
DOMRectList

The DOMRectList interface represents a collection of DOMRect objects, typically used to hold the rectangles associated with a particular element, like bounding boxes returned by methods such as Element.getClientRects. It provides access to each rectangle in the list via its index, along with a length property that indicates the total number of rectangles in…
61
79
27
10.1
61
10.3
item

The DOMRectList method item() returns the DOMRect at the specified index within the list, or null if the index is out of range.
2
12
3
4
18
3
length

The read-only length property of the DOMRectList interface returns the number of DOMRect objects in the list.
2
12
3
4
18
3
DOMRectReadOnly

The DOMRectReadOnly interface specifies the standard properties (also used by DOMRect) to define a rectangle whose properties are immutable.
61
79
31
10.1
61
10.3
bottom

The bottom read-only property of the DOMRectReadOnly interface returns the bottom coordinate value of the DOMRect. (Has the same value as y + height, or y if height is negative.)
2
12
3
4
18
3.2
DOMRectReadOnly

The DOMRectReadOnly() constructor creates a new DOMRectReadOnly object.
61
79
62
10.1
61
10.3
fromRect_static

The fromRect() static method of the DOMRectReadOnly object creates a new DOMRectReadOnly object with a given location and dimensions.
61
79
69
10.1
61
10.3
height

The height read-only property of the DOMRectReadOnly interface represents the height of the DOMRect.
2
12
3
4
18
3.2
left

The left read-only property of the DOMRectReadOnly interface returns the left coordinate value of the DOMRect. (Has the same value as x, or x + width if width is negative.)
2
12
3
4
18
3.2
right

The right read-only property of the DOMRectReadOnly interface returns the right coordinate value of the DOMRect. (Has the same value as x + width, or x if width is negative.)
2
12
3
4
18
3.2
toJSON

The DOMRectReadOnly method toJSON() returns a JSON representation of the DOMRectReadOnly object.
61
79
62
10.1
61
10.3
top

The top read-only property of the DOMRectReadOnly interface returns the top coordinate value of the DOMRect. (Has the same value as y, or y + height if height is negative.)
2
12
3
4
18
3.2
width

The width read-only property of the DOMRectReadOnly interface represents the width of the DOMRect.
2
12
3
4
18
3.2
worker_support

Available in workers
61
79
69
10.1
61
10.3
x

The x read-only property of the DOMRectReadOnly interface represents the x coordinate of the DOMRect's origin.
61
79
31
10.1
61
10.3
y

The y read-only property of the DOMRectReadOnly interface represents the y coordinate of the DOMRect's origin.
61
79
31
10.1
61
10.3
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (5)
  • Previously available under a different name: WebKitCSSMatrix (2)
Notes 4 item(s)
Implementation note
  • Previously available under a different name: WebKitCSSMatrix (12)
  • Previously available under a different name: SVGMatrix (12)
  • Previously available under a different name: MSCSSMatrix (12)
Removed
  • This feature was removed in a later browser version (79)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: WebKitCSSMatrix (49)
  • Previously available under a different name: SVGMatrix (1.5)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (5)
  • Previously available under a different name: WebKitCSSMatrix (4)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (18)
  • Previously available under a different name: WebKitCSSMatrix (18)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (4)
  • Previously available under a different name: WebKitCSSMatrix (3)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (5)
  • Previously available under a different name: WebKitCSSMatrix (2)
Notes 4 item(s)
Implementation note
  • Previously available under a different name: WebKitCSSMatrix (12)
  • Previously available under a different name: SVGMatrix (12)
  • Previously available under a different name: MSCSSMatrix (12)
Removed
  • This feature was removed in a later browser version (79)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: WebKitCSSMatrix (49)
  • Previously available under a different name: SVGMatrix (1.5)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (5)
  • Previously available under a different name: WebKitCSSMatrix (4)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (18)
  • Previously available under a different name: WebKitCSSMatrix (18)
Notes 2 item(s)
Implementation note
  • Previously available under a different name: SVGMatrix (4)
  • Previously available under a different name: WebKitCSSMatrix (3)
Notes 1 item(s)
Implementation note
  • Starting in Firefox 69, the first parameter (`scale`) is now optional with a default value of 1, per the specification. Previously it was required.
Notes 1 item(s)
Implementation note
  • Firefox 69 introduced support for the modern six-parameter syntax for `scaleSelf()`. Previously, it only supported the older three-parameter syntax: `scale(scaleX[, originX][, originY]]])`.
Notes 1 item(s)
Implementation note
  • Firefox 69 introduced support for the modern six-parameter syntax for `scale()`. Previously, it only supported the older three-parameter syntax: `scale(scaleX[, originX][, originY]]])`.
Notes 1 item(s)
Implementation note
  • Starting in Firefox 69, the first parameter (`scale`) is now optional with a default value of 1, per the specification. Previously it was required.
Notes 1 item(s)
Implementation note
  • Before Firefox 69, the `sx` parameter was required; you may now call `skewX()` with no inputs. A value of 0 is correctly assumed.
Notes 1 item(s)
Implementation note
  • Before Firefox 69, the `sy` parameter was required; you may now call `skewY()` with no inputs. A value of 0 is correctly assumed.
Notes 1 item(s)
Implementation note
  • Before Firefox 69, the default value of `p1` through `p4` was undefined; now `DOMQuadInit` defines these as `false`.
Notes 1 item(s)
Implementation note
  • Before Firefox 69, the default value of `p1` through `p4` was undefined; now `DOMQuadInit` defines these as `false`.
Notes 1 item(s)
Implementation note
  • Before Firefox 69, the default value of `p1` through `p4` was undefined; now `DOMQuadInit` defines these as `false`.
Notes 1 item(s)
Implementation note
  • Before Firefox 69, the default value of `p1` through `p4` was undefined; now `DOMQuadInit` defines these as `false`.
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (61)
Implementation note
  • Previously available under a different name: ClientRect (2)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (79)
Implementation note
  • Previously available under a different name: ClientRect (12)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (27)
Implementation note
  • Previously available under a different name: ClientRect (3)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (11)
Implementation note
  • Previously available under a different name: ClientRect (4)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (61)
Implementation note
  • Previously available under a different name: ClientRect (18)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (11)
Implementation note
  • Previously available under a different name: ClientRect (3.2)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (61)
Implementation note
  • Previously available under a different name: ClientRectList (2)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (79)
Implementation note
  • Previously available under a different name: ClientRectList (12)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (27)
Implementation note
  • Previously available under a different name: ClientRectList (3)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (11)
Implementation note
  • Previously available under a different name: ClientRectList (4)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (61)
Implementation note
  • Previously available under a different name: ClientRectList (18)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (11)
Implementation note
  • Previously available under a different name: ClientRectList (3)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (61)
Implementation note
  • Previously available under a different name: ClientRect (2)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (79)
Implementation note
  • Previously available under a different name: ClientRect (12)
Notes 4 item(s)
Removed
  • This feature was removed in a later browser version (31)
  • This feature was removed in a later browser version (27)
Implementation note
  • Previously available under a different name: DOMRect (27)
  • Previously available under a different name: ClientRect (3)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (11)
Implementation note
  • Previously available under a different name: ClientRect (4)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (61)
Implementation note
  • Previously available under a different name: ClientRect (18)
Notes 2 item(s)
Removed
  • This feature was removed in a later browser version (11)
Implementation note
  • Previously available under a different name: ClientRect (3.2)

Use cases

  • Using DOM Geometry

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

Cautions

  • May not be supported in older browsers.

Implementation notes

  • Some APIs require a secure context (HTTPS) or user activation. Check the requirements before use.

Related links