Table of Contents

Class DOMMatrix

Namespace
CSharpToJavaScript.APIs.JS
Assembly
CSharpToJavaScript.dll

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.

[Value("DOMMatrix")]
public class DOMMatrix : DOMMatrixReadOnly
Inheritance
DOMMatrix
Inherited Members

Remarks

WebKitCSSMatrix and SVGMatrix are aliases to DOMMatrix.

-Is2D
-IsIdentity

See also on MDN

Constructors

DOMMatrix() 

public DOMMatrix()

DOMMatrix(Union50)

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

public DOMMatrix(Union50 init = default)

Parameters

init Union50

Remarks

See also on MDN

Properties

A 

[Value("a")]
public double A { get; set; }

Property Value

double

B 

[Value("b")]
public double B { get; set; }

Property Value

double

C 

[Value("c")]
public double C { get; set; }

Property Value

double

D 

[Value("d")]
public double D { get; set; }

Property Value

double

E 

[Value("e")]
public double E { get; set; }

Property Value

double

F 

[Value("f")]
public double F { get; set; }

Property Value

double

M11 

[Value("m11")]
public double M11 { get; set; }

Property Value

double

M12 

[Value("m12")]
public double M12 { get; set; }

Property Value

double

M13 

[Value("m13")]
public double M13 { get; set; }

Property Value

double

M14 

[Value("m14")]
public double M14 { get; set; }

Property Value

double

M21 

[Value("m21")]
public double M21 { get; set; }

Property Value

double

M22 

[Value("m22")]
public double M22 { get; set; }

Property Value

double

M23 

[Value("m23")]
public double M23 { get; set; }

Property Value

double

M24 

[Value("m24")]
public double M24 { get; set; }

Property Value

double

M31 

[Value("m31")]
public double M31 { get; set; }

Property Value

double

M32 

[Value("m32")]
public double M32 { get; set; }

Property Value

double

M33 

[Value("m33")]
public double M33 { get; set; }

Property Value

double

M34 

[Value("m34")]
public double M34 { get; set; }

Property Value

double

M41 

[Value("m41")]
public double M41 { get; set; }

Property Value

double

M42 

[Value("m42")]
public double M42 { get; set; }

Property Value

double

M43 

[Value("m43")]
public double M43 { get; set; }

Property Value

double

M44 

[Value("m44")]
public double M44 { get; set; }

Property Value

double

Methods

FromFloat32Array(Float32Array) 

[Value("fromFloat32Array")]
public static DOMMatrix FromFloat32Array(Float32Array array32)

Parameters

array32 Float32Array

Returns

DOMMatrix

FromFloat64Array(Float64Array) 

[Value("fromFloat64Array")]
public static DOMMatrix FromFloat64Array(Float64Array array64)

Parameters

array64 Float64Array

Returns

DOMMatrix

FromMatrix(DOMMatrixInit) 

[Value("fromMatrix")]
public static DOMMatrix FromMatrix(DOMMatrixInit other = null)

Parameters

other DOMMatrixInit

Returns

DOMMatrix

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.

[Value("invertSelf")]
public DOMMatrix InvertSelf()

Returns

DOMMatrix

A DOMMatrix.

Remarks

To invert a matrix without mutating it, see Inverse()

-Inverse()
-CSS transform-function/matrix function
-CSS transform-function/matrix3d function

See also on MDN

MultiplySelf(DOMMatrixInit)

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.

[Value("multiplySelf")]
public DOMMatrix MultiplySelf(DOMMatrixInit other = null)

Parameters

other DOMMatrixInit

Returns

DOMMatrix

Returns itself; the DOMMatrix updated to the results of the applied multiplications.

Remarks

To multiply a matrix without mutating it, see Multiply(DOMMatrixInit).

-Multiply(DOMMatrixInit)
-PreMultiplySelf(DOMMatrixInit)
-CSS transform-function/matrix function
-CSS transform-function/matrix3d function

See also on MDN

PreMultiplySelf(DOMMatrixInit)

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.

[Value("preMultiplySelf")]
public DOMMatrix PreMultiplySelf(DOMMatrixInit other = null)

Parameters

other DOMMatrixInit

Returns

DOMMatrix

Returns itself; a DOMMatrix updated to results of the applied multiplications.

Remarks

-MultiplySelf(DOMMatrixInit)
-Multiply(DOMMatrixInit)
-CSS transform-function/matrix function
-CSS transform-function/matrix3d function

See also on MDN

RotateAxisAngleSelf(double, double, double, double)

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.

[Value("rotateAxisAngleSelf")]
public DOMMatrix RotateAxisAngleSelf(double x = 0, double y = 0, double z = 0, double angle = 0)

Parameters

x double
y double
z double
angle double

Returns

DOMMatrix

A DOMMatrix.

Remarks

To rotate a matrix without mutating it, see RotateAxisAngle(double, double, double, double), which creates a new rotated matrix while leaving the original unchanged.

-RotateAxisAngle(double, double, double, double)
-RotateSelf(double, double, double)
-RotateFromVectorSelf(double, double)
-CSS transform property and transform-function/rotate3d function
-CSS rotate property
-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface and CanvasRenderingContext2D.Rotate method

See also on MDN

RotateFromVectorSelf(double, double)

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.

[Value("rotateFromVectorSelf")]
public DOMMatrix RotateFromVectorSelf(double x = 0, double y = 0)

Parameters

x double
y double

Returns

DOMMatrix

Returns itself; the updated DOMMatrix.

Remarks

To rotate a matrix from a vector without mutating it, see RotateFromVector(double, double), which creates a new rotated matrix while leaving the original unchanged.

-RotateFromVector(double, double)
-RotateSelf(double, double, double)
-RotateAxisAngleSelf(double, double, double, double)
-CSS transform property and transform-function/rotate3d function
-CSS rotate property
-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface and CanvasRenderingContext2D.Rotate method

See also on MDN

RotateSelf(double, double, double)

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.

[Value("rotateSelf")]
public DOMMatrix RotateSelf(double rotX = 0, double rotY = 0, double rotZ = 0)

Parameters

rotX double
rotY double
rotZ double

Returns

DOMMatrix

Returns itself; the DOMMatrix rotated by the given
vectors.

Remarks

To rotate a matrix without mutating it, see Rotate(double, double, double)

-Rotate(double, double, double)
-CSS transform property
-CSS rotate property
-CSS transform-function functions-transform-function/rotate
-transform-function/rotate3d
-transform-function/rotateX
-transform-function/rotateY
-transform-function/rotateZ

-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface methods-CanvasRenderingContext2D.Rotate
-CanvasRenderingContext2D.Transform
-CanvasRenderingContext2D.SetTransform
-CanvasRenderingContext2D.ResetTransform

See also on MDN

Scale3dSelf(double, double, double, double)

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.

[Value("scale3dSelf")]
public DOMMatrix Scale3dSelf(double scale = 0, double originX = 0, double originY = 0, double originZ = 0)

Parameters

scale double
originX double
originY double
originZ double

Returns

DOMMatrix

Returns itself; a DOMMatrix.

Remarks

To 3D-scale a matrix without mutating it, see Scale3d(double, double, double, double), which creates a new scaled matrix while leaving the original unchanged.

-Scale3d(double, double, double, double)
-ScaleSelf(double, double, double, double, double, double)
-CSS transform property and the transform-function/scale and transform-function/matrix3d functions
-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface CanvasRenderingContext2D.Transform method

See also on MDN

ScaleSelf(double, double, double, double, double, double)

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.

[Value("scaleSelf")]
public DOMMatrix ScaleSelf(double scaleX = 0, double scaleY = 0, double scaleZ = 0, double originX = 0, double originY = 0, double originZ = 0)

Parameters

scaleX double
scaleY double
scaleZ double
originX double
originY double
originZ double

Returns

DOMMatrix

Returns itself; a DOMMatrix.If a scale is applied about the z-axis, the matrix will be a 4✕4 3D matrix.

Remarks

To scale a matrix without mutating it, see Scale(double, double, double, double, double, double), which creates a new scaled matrix while leaving the original unchanged.

-Scale(double, double, double, double, double, double)
-Scale3dSelf(double, double, double, double)
-CSS transform property and the transform-function/scale and transform-function/matrix functions
-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface CanvasRenderingContext2D.Transform method

See also on MDN

SetMatrixValue(string)

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.

[Value("setMatrixValue")]
public DOMMatrix SetMatrixValue(string transformList)

Parameters

transformList string

Returns

DOMMatrix

Returns itself; the DOMMatrix with updated values.

Remarks

-TranslateSelf(double, double, double)
-Is2D
-CSS transform-function/matrix function
-CSS transform-function/matrix3d function

See also on MDN

SkewXSelf(double)

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.

[Value("skewXSelf")]
public DOMMatrix SkewXSelf(double sx = 0)

Parameters

sx double

Returns

DOMMatrix

Returns itself; the DOMMatrix skewed along the X-axis by the given
angle.

Remarks

To skew a matrix along the X-axis without mutating it, see SkewX(double)

-SkewX(double)
-CSS transform property
-CSS transform-function functions-transform-function/skew
-transform-function/skewX
-transform-function/skewY

-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface methods-CanvasRenderingContext2D.Transform
-CanvasRenderingContext2D.SetTransform
-CanvasRenderingContext2D.ResetTransform

See also on MDN

SkewYSelf(double)

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.

[Value("skewYSelf")]
public DOMMatrix SkewYSelf(double sy = 0)

Parameters

sy double

Returns

DOMMatrix

Returns itself; the DOMMatrix skewed along the Y-axis by the given
angle.

Remarks

To skew a matrix along the Y-axis without mutating it, see SkewY(double)

-SkewY(double)
-CSS transform property
-CSS transform-function functions-transform-function/skew
-transform-function/skewX
-transform-function/skewY

-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface methods-CanvasRenderingContext2D.Transform
-CanvasRenderingContext2D.SetTransform
-CanvasRenderingContext2D.ResetTransform

See also on MDN

TranslateSelf(double, double, double)

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

[Value("translateSelf")]
public DOMMatrix TranslateSelf(double tx = 0, double ty = 0, double tz = 0)

Parameters

tx double
ty double
tz double

Returns

DOMMatrix

Returns itself; the DOMMatrix translated by the given
vector.

Remarks

To translate a matrix without mutating it, see Translate(double, double, double)

-Translate(double, double, double)
-CSS transform property
-CSS translate property
-CSS transform-function functions-transform-function/translate
-transform-function/translate3d
-transform-function/translateX
-transform-function/translateY
-transform-function/translateZ

-CSS transforms module
-SVG transform attribute
-CanvasRenderingContext2D interface methods-CanvasRenderingContext2D.Translate
-CanvasRenderingContext2D.Transform
-CanvasRenderingContext2D.SetTransform
-CanvasRenderingContext2D.ResetTransform

See also on MDN

Edit this page