--- title: "DOMMatrix | JavaScript maps SDK" description: "Documentation for MapTiler SDK" --- > For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL. # Interface DOMMatrix 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix) interface DOMMatrix {     [a](#a): number;     [b](#b): number;     [c](#c): number;     [d](#d): number;     [e](#e): number;     [f](#f): number;     [is2D](#is2d): boolean;     [isIdentity](#isidentity): boolean;     [m11](#m11): number;     [m12](#m12): number;     [m13](#m13): number;     [m14](#m14): number;     [m21](#m21): number;     [m22](#m22): number;     [m23](#m23): number;     [m24](#m24): number;     [m31](#m31): number;     [m32](#m32): number;     [m33](#m33): number;     [m34](#m34): number;     [m41](#m41): number;     [m42](#m42): number;     [m43](#m43): number;     [m44](#m44): number;     [flipX](#flipx-1)(): DOMMatrix;     [flipY](#flipy-1)(): DOMMatrix;     [inverse](#inverse-1)(): DOMMatrix;     [invertSelf](#invertself-1)(): DOMMatrix;     [multiply](#multiply-1)(other?: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/)): DOMMatrix;     [multiplySelf](#multiplyself-1)(other?: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/)): DOMMatrix;     [preMultiplySelf](#premultiplyself-1)(other?: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/)): DOMMatrix;     [rotate](#rotate-1)(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix;     [rotateAxisAngle](#rotateaxisangle-1)(         x?: number,         y?: number,         z?: number,         angle?: number,     ): DOMMatrix;     [rotateAxisAngleSelf](#rotateaxisangleself-1)(         x?: number,         y?: number,         z?: number,         angle?: number,     ): DOMMatrix;     [rotateFromVector](#rotatefromvector-1)(x?: number, y?: number): DOMMatrix;     [rotateFromVectorSelf](#rotatefromvectorself-1)(x?: number, y?: number): DOMMatrix;     [rotateSelf](#rotateself-1)(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix;     [scale](#scale-1)(         scaleX?: number,         scaleY?: number,         scaleZ?: number,         originX?: number,         originY?: number,         originZ?: number,     ): DOMMatrix;     [scale3d](#scale3d-1)(         scale?: number,         originX?: number,         originY?: number,         originZ?: number,     ): DOMMatrix;     [scale3dSelf](#scale3dself-1)(         scale?: number,         originX?: number,         originY?: number,         originZ?: number,     ): DOMMatrix;     [scaleNonUniform](#scalenonuniform-1)(scaleX?: number, scaleY?: number): DOMMatrix;     [scaleSelf](#scaleself-1)(         scaleX?: number,         scaleY?: number,         scaleZ?: number,         originX?: number,         originY?: number,         originZ?: number,     ): DOMMatrix;     [setMatrixValue](#setmatrixvalue-1)(transformList: string): DOMMatrix;     [skewX](#skewx-1)(sx?: number): DOMMatrix;     [skewXSelf](#skewxself-1)(sx?: number): DOMMatrix;     [skewY](#skewy-1)(sy?: number): DOMMatrix;     [skewYSelf](#skewyself-1)(sy?: number): DOMMatrix;     [toFloat32Array](#tofloat32array-1)(): Float32Array;     [toFloat64Array](#tofloat64array-1)(): Float64Array;     [toJSON](#tojson-1)(): any;     [toString](#tostring-1)(): string;     [transformPoint](#transformpoint-1)(point?: [DOMPointInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMPointInit/)): [DOMPoint](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMPoint/);     [translate](#translate-1)(tx?: number, ty?: number, tz?: number): DOMMatrix;     [translateSelf](#translateself-1)(tx?: number, ty?: number, tz?: number): DOMMatrix; } #### Hierarchy ([View Summary](https://docs.maptiler.com/sdk-js/api-reference/hierarchy/#Externals.DOMMatrix)) - [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/) - DOMMatrix ##### Index ### Properties[](#properties) [a](#a) [b](#b) [c](#c) [d](#d) [e](#e) [f](#f) [is2D](#is2d) [isIdentity](#isidentity) [m11](#m11) [m12](#m12) [m13](#m13) [m14](#m14) [m21](#m21) [m22](#m22) [m23](#m23) [m24](#m24) [m31](#m31) [m32](#m32) [m33](#m33) [m34](#m34) [m41](#m41) [m42](#m42) [m43](#m43) [m44](#m44) ### Methods[](#methods) [flipX](#flipx) [flipY](#flipy) [inverse](#inverse) [invertSelf](#invertself) [multiply](#multiply) [multiplySelf](#multiplyself) [preMultiplySelf](#premultiplyself) [rotate](#rotate) [rotateAxisAngle](#rotateaxisangle) [rotateAxisAngleSelf](#rotateaxisangleself) [rotateFromVector](#rotatefromvector) [rotateFromVectorSelf](#rotatefromvectorself) [rotateSelf](#rotateself) [scale](#scale) [scale3d](#scale3d) [scale3dSelf](#scale3dself) [scaleNonUniform](#scalenonuniform) [scaleSelf](#scaleself) [setMatrixValue](#setmatrixvalue) [skewX](#skewx) [skewXSelf](#skewxself) [skewY](#skewy) [skewYSelf](#skewyself) [toFloat32Array](#tofloat32array) [toFloat64Array](#tofloat64array) [toJSON](#tojson) [toString](#tostring) [transformPoint](#transformpoint) [translate](#translate) [translateSelf](#translateself) ## Properties[](#properties-1) ### a[](#a) a: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[a](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#a) ### b[](#b) b: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[b](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#b) ### c[](#c) c: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[c](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#c) ### d[](#d) d: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[d](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#d) ### e[](#e) e: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[e](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#e) ### f[](#f) f: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[f](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#f) ### `Readonly`is2D[](#is2d) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/is2D) Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[is2D](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#is2d) ### `Readonly`isIdentity[](#isidentity) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/isIdentity) Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[isIdentity](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#isidentity) ### m11[](#m11) m11: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m11](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m11) ### m12[](#m12) m12: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m12](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m12) ### m13[](#m13) m13: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m13](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m13) ### m14[](#m14) m14: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m14](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m14) ### m21[](#m21) m21: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m21](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m21) ### m22[](#m22) m22: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m22](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m22) ### m23[](#m23) m23: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m23](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m23) ### m24[](#m24) m24: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m24](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m24) ### m31[](#m31) m31: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m31](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m31) ### m32[](#m32) m32: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m32](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m32) ### m33[](#m33) m33: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m33](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m33) ### m34[](#m34) m34: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m34](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m34) ### m41[](#m41) m41: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m41](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m41) ### m42[](#m42) m42: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m42](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m42) ### m43[](#m43) m43: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m43](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m43) ### m44[](#m44) m44: number [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix#instance_properties) Overrides [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[m44](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#m44) ## Methods[](#methods-1) ### flipX[](#flipx) - flipX(): DOMMatrix[](#flipx-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/flipX) #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[flipX](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#flipx) ### flipY[](#flipy) - flipY(): DOMMatrix[](#flipy-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/flipY) #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[flipY](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#flipy) ### inverse[](#inverse) - inverse(): DOMMatrix[](#inverse-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/inverse) #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[inverse](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#inverse) ### invertSelf[](#invertself) - invertSelf(): DOMMatrix[](#invertself-1) 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 is2D property is set to false. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/invertSelf) #### Returns DOMMatrix ### multiply[](#multiply) - multiply(other?: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/)): DOMMatrix[](#multiply-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/multiply) #### Parameters - `Optional`other: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/) #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[multiply](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#multiply) ### multiplySelf[](#multiplyself) - multiplySelf(other?: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/)): DOMMatrix[](#multiplyself-1) 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 and to its left: m33 and m34. These have the default value of 1. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/multiplySelf) #### Parameters - `Optional`other: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/) #### Returns DOMMatrix ### preMultiplySelf[](#premultiplyself) - preMultiplySelf(other?: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/)): DOMMatrix[](#premultiplyself-1) 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 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/preMultiplySelf) #### Parameters - `Optional`other: [DOMMatrixInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixInit/) #### Returns DOMMatrix ### rotate[](#rotate) - rotate(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix[](#rotate-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/rotate) #### Parameters - `Optional`rotX: number - `Optional`rotY: number - `Optional`rotZ: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[rotate](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#rotate) ### rotateAxisAngle[](#rotateaxisangle) - rotateAxisAngle(x?: number, y?: number, z?: number, angle?: number): DOMMatrix[](#rotateaxisangle-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/rotateAxisAngle) #### Parameters - `Optional`x: number - `Optional`y: number - `Optional`z: number - `Optional`angle: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[rotateAxisAngle](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#rotateaxisangle) ### rotateAxisAngleSelf[](#rotateaxisangleself) - rotateAxisAngleSelf(     x?: number,     y?: number,     z?: number,     angle?: number, ): DOMMatrix[](#rotateaxisangleself-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/rotateAxisAngleSelf) #### Parameters - `Optional`x: number - `Optional`y: number - `Optional`z: number - `Optional`angle: number #### Returns DOMMatrix ### rotateFromVector[](#rotatefromvector) - rotateFromVector(x?: number, y?: number): DOMMatrix[](#rotatefromvector-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/rotateFromVector) #### Parameters - `Optional`x: number - `Optional`y: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[rotateFromVector](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#rotatefromvector) ### rotateFromVectorSelf[](#rotatefromvectorself) - rotateFromVectorSelf(x?: number, y?: number): DOMMatrix[](#rotatefromvectorself-1) 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 angle is specified as 0, and the matrix is not altered. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/rotateFromVectorSelf) #### Parameters - `Optional`x: number - `Optional`y: number #### Returns DOMMatrix ### rotateSelf[](#rotateself) - rotateSelf(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix[](#rotateself-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/rotateSelf) #### Parameters - `Optional`rotX: number - `Optional`rotY: number - `Optional`rotZ: number #### Returns DOMMatrix ### scale[](#scale) - scale(     scaleX?: number,     scaleY?: number,     scaleZ?: number,     originX?: number,     originY?: number,     originZ?: number, ): DOMMatrix[](#scale-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/scale) #### Parameters - `Optional`scaleX: number - `Optional`scaleY: number - `Optional`scaleZ: number - `Optional`originX: number - `Optional`originY: number - `Optional`originZ: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[scale](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#scale) ### scale3d[](#scale3d) - scale3d(     scale?: number,     originX?: number,     originY?: number,     originZ?: number, ): DOMMatrix[](#scale3d-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/scale3d) #### Parameters - `Optional`scale: number - `Optional`originX: number - `Optional`originY: number - `Optional`originZ: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[scale3d](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#scale3d) ### scale3dSelf[](#scale3dself) - scale3dSelf(     scale?: number,     originX?: number,     originY?: number,     originZ?: number, ): DOMMatrix[](#scale3dself-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/scale3dSelf) #### Parameters - `Optional`scale: number - `Optional`originX: number - `Optional`originY: number - `Optional`originZ: number #### Returns DOMMatrix ### scaleNonUniform[](#scalenonuniform) - scaleNonUniform(scaleX?: number, scaleY?: number): DOMMatrix[](#scalenonuniform-1) #### Parameters - `Optional`scaleX: number - `Optional`scaleY: number #### Returns DOMMatrix #### Deprecated[](#deprecated) Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[scaleNonUniform](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#scalenonuniform) ### scaleSelf[](#scaleself) - scaleSelf(     scaleX?: number,     scaleY?: number,     scaleZ?: number,     originX?: number,     originY?: number,     originZ?: number, ): DOMMatrix[](#scaleself-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/scaleSelf) #### Parameters - `Optional`scaleX: number - `Optional`scaleY: number - `Optional`scaleZ: number - `Optional`originX: number - `Optional`originY: number - `Optional`originZ: number #### Returns DOMMatrix ### setMatrixValue[](#setmatrixvalue) - setMatrixValue(transformList: string): DOMMatrix[](#setmatrixvalue-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/setMatrixValue) #### Parameters - transformList: string #### Returns DOMMatrix ### skewX[](#skewx) - skewX(sx?: number): DOMMatrix[](#skewx-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/skewX) #### Parameters - `Optional`sx: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[skewX](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#skewx) ### skewXSelf[](#skewxself) - skewXSelf(sx?: number): DOMMatrix[](#skewxself-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/skewXSelf) #### Parameters - `Optional`sx: number #### Returns DOMMatrix ### skewY[](#skewy) - skewY(sy?: number): DOMMatrix[](#skewy-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/skewY) #### Parameters - `Optional`sy: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[skewY](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#skewy) ### skewYSelf[](#skewyself) - skewYSelf(sy?: number): DOMMatrix[](#skewyself-1) 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. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/skewYSelf) #### Parameters - `Optional`sy: number #### Returns DOMMatrix ### toFloat32Array[](#tofloat32array) - toFloat32Array(): Float32Array[](#tofloat32array-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/toFloat32Array) #### Returns Float32Array Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[toFloat32Array](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#tofloat32array) ### toFloat64Array[](#tofloat64array) - toFloat64Array(): Float64Array[](#tofloat64array-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/toFloat64Array) #### Returns Float64Array Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[toFloat64Array](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#tofloat64array) ### toJSON[](#tojson) - toJSON(): any[](#tojson-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/toJSON) #### Returns any Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[toJSON](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#tojson) ### toString[](#tostring) - toString(): string[](#tostring-1) #### Returns string Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[toString](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#tostring) ### transformPoint[](#transformpoint) - transformPoint(point?: [DOMPointInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMPointInit/)): [DOMPoint](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMPoint/)[](#transformpoint-1) 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](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/transformPoint) #### Parameters - `Optional`point: [DOMPointInit](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMPointInit/) #### Returns [DOMPoint](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMPoint/) Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[transformPoint](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#transformpoint) ### translate[](#translate) - translate(tx?: number, ty?: number, tz?: number): DOMMatrix[](#translate-1) The **`translate()`** method of the DOMMatrixReadOnly interface creates a new matrix being the result of the original matrix with a translation applied. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrixReadOnly/translate) #### Parameters - `Optional`tx: number - `Optional`ty: number - `Optional`tz: number #### Returns DOMMatrix Inherited from [DOMMatrixReadOnly](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/).[translate](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.DOMMatrixReadOnly/#translate) ### translateSelf[](#translateself) - translateSelf(tx?: number, ty?: number, tz?: number): DOMMatrix[](#translateself-1) 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\]. [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMMatrix/translateSelf) #### Parameters - `Optional`tx: number - `Optional`ty: number - `Optional`tz: number #### Returns DOMMatrix