The DOMMatrix, DOMPoint, DOMQuad and DOMRect interfaces offer a way to represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.

Learning resources on MDN

• DOMMatrix
• DOMMatrix: DOMMatrix() constructor
• DOMMatrix: invertSelf() method
• DOMMatrix: rotateSelf() method
• DOMMatrix: setMatrixValue() method
• DOMMatrix: skewXSelf() method
• DOMMatrix: skewYSelf() method
• DOMMatrix: translateSelf() method
• DOMMatrixReadOnly
• DOMMatrixReadOnly: DOMMatrixReadOnly() constructor
• DOMMatrixReadOnly: flipX() method
• DOMMatrixReadOnly: inverse() method
• DOMMatrixReadOnly: scale() method
• DOMMatrixReadOnly: toJSON() method
• DOMMatrixReadOnly: toString() method
• DOMMatrixReadOnly: translate() method
• DOMPoint
• DOMPoint: DOMPoint() constructor
• DOMPoint: fromPoint() static method
• DOMPoint: w property
• DOMPoint: x property
• DOMPoint: y property
• DOMPoint: z property
• DOMPointReadOnly
• DOMPointReadOnly: DOMPointReadOnly() constructor
• DOMPointReadOnly: fromPoint() static method
• DOMPointReadOnly: toJSON() method
• DOMPointReadOnly: w property
• DOMPointReadOnly: x property
• DOMPointReadOnly: y property
• DOMPointReadOnly: z property
• DOMQuad
• DOMQuad: DOMQuad() constructor
• DOMQuad: getBounds() method
• DOMQuad: p1 property
• DOMQuad: p2 property
• DOMQuad: p3 property
• DOMQuad: p4 property
• DOMQuad: toJSON() method
• DOMRect
• DOMRect: DOMRect() constructor
• DOMRect: fromRect() static method
• DOMRect: height property
• DOMRect: width property
• DOMRect: x property
• DOMRect: y property
• DOMRectList
• DOMRectList: item() method
• DOMRectList: length property
• DOMRectReadOnly
• DOMRectReadOnly: DOMRectReadOnly() constructor
• DOMRectReadOnly: bottom property
• DOMRectReadOnly: fromRect() static method
• DOMRectReadOnly: height property
• DOMRectReadOnly: left property
• DOMRectReadOnly: right property
• DOMRectReadOnly: toJSON() method
• DOMRectReadOnly: top property
• DOMRectReadOnly: width property
• DOMRectReadOnly: x property
• DOMRectReadOnly: y property

Browser support

• Chrome 61 Released on 2017-09-05
• Chrome Android 61 Released on 2017-09-05
• Edge 79 Released on 2020-01-15
• Firefox 33 Released on 2014-10-14
• Firefox for Android 33 Released on 2014-10-14
• Safari 11 Released on 2017-09-19
• Safari on iOS 11 Released on 2017-09-19

Edit this feature - Report an issue about this feature