DOMMatrixReadOnly

interface · experimental

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

MDN

| m11 m21 m31 m41 |
| m12 m22 m32 m42 |
| m13 m23 m33 m43 |
| m14 m24 m34 m44 |

variable · experimental

var DOMMatrixReadOnly: { … }

MDN

| m11 m21 m31 m41 |
| m12 m22 m32 m42 |
| m13 m23 m33 m43 |
| m14 m24 m34 m44 |

Constructors

`constructor`

new DOMMatrixReadOnly(init?: string | number[]): DOMMatrixReadOnly

Properties

`a`

readonly a: number

MDN Reference

`b`

readonly b: number

MDN Reference

`c`

readonly c: number

MDN Reference

`d`

readonly d: number

MDN Reference

`e`

readonly e: number

MDN Reference

`f`

readonly f: number

MDN Reference

`is2D`

readonly is2D: boolean

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.

MDN Reference

`isIdentity`

readonly isIdentity: boolean

The readonly isIdentity property of the DOMMatrixReadOnly interface is a Boolean whose value is true if the matrix is the identity matrix.

MDN Reference

`m11`

readonly m11: number

MDN Reference

`m12`

readonly m12: number

MDN Reference

`m13`

readonly m13: number

MDN Reference

`m14`

readonly m14: number

MDN Reference

`m21`

readonly m21: number

MDN Reference

`m22`

readonly m22: number

MDN Reference

`m23`

readonly m23: number

MDN Reference

`m24`

readonly m24: number

MDN Reference

`m31`

readonly m31: number

MDN Reference

`m32`

readonly m32: number

MDN Reference

`m33`

readonly m33: number

MDN Reference

`m34`

readonly m34: number

MDN Reference

`m41`

readonly m41: number

MDN Reference

`m42`

readonly m42: number

MDN Reference

`m43`

readonly m43: number

MDN Reference

`m44`

readonly m44: number

MDN Reference

`prototype`

prototype: DOMMatrixReadOnly

Methods

`flipX`

flipX(): DOMMatrix

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.

MDN Reference

`flipY`

flipY(): DOMMatrix

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.

MDN Reference

`inverse`

inverse(): DOMMatrix

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 is2D property is set to false. The original matrix is not changed.

MDN Reference

`multiply`

multiply(other?: DOMMatrixInit): DOMMatrix

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 the default value of 1. The original matrix is not modified.

MDN Reference

`rotate`

rotate(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix

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.

MDN Reference

`rotateAxisAngle`

rotateAxisAngle(x?: number, y?: number, z?: number, angle?: number): DOMMatrix

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.

MDN Reference

`rotateFromVector`

rotateFromVector(x?: number, y?: number): DOMMatrix

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 specified as 0. The original matrix is not altered.

MDN Reference

`scale`

scale(scaleX?: number, scaleY?: number, scaleZ?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix

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

MDN Reference

`scale3d`

scale3d(scale?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix

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 matrix is not modified.

MDN Reference

`scaleNonUniform`

scaleNonUniform(scaleX?: number, scaleY?: number): DOMMatrix

Deprecated.

`skewX`

skewX(sx?: number): DOMMatrix

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.

MDN Reference

`skewY`

skewY(sy?: number): DOMMatrix

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.

MDN Reference

`toFloat32Array`

toFloat32Array(): Float32Array<ArrayBuffer>

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") order. (In other words, down the first column from top to bottom, then the second column, and so forth.)

MDN Reference

`toFloat64Array`

toFloat64Array(): Float64Array<ArrayBuffer>

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") order. (In other words, down the first column from top to bottom, then the second column, and so forth.)

MDN Reference

`toJSON`

toJSON(): any

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 is2D property, and the boolean isIdentity property.

MDN Reference

`transformPoint`

transformPoint(point?: DOMPointInit): DOMPoint

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.

MDN Reference

`translate`

translate(tx?: number, ty?: number, tz?: number): DOMMatrix

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

MDN Reference

`toString`

toString(): string

`fromFloat32Array`

fromFloat32Array(array32: Float32Array<ArrayBuffer>): DOMMatrixReadOnly

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

MDN Reference

`fromFloat64Array`

fromFloat64Array(array64: Float64Array<ArrayBuffer>): DOMMatrixReadOnly

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

MDN Reference

`fromMatrix`

fromMatrix(other?: DOMMatrixInit): DOMMatrixReadOnly

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.

MDN Reference