Geometry Api
DOMMatrix
The DOMMatrix class represents the transformation matrix in 2D or 3D space.
| constructor | description |
|---|---|
| DOMMatrix() | Creates identity matrix for 2D space. |
| DOMMatrix(cssTransform) |
Creates matrix from the css transform value, for example
from string 'scale(2) translate(10px, 10px)' |
| DOMMatrix(m11, m12,...,m44) |
Creates the transform matrix for 3D space.
|
| DOMMatrix(a, b, c, d, e, f) |
Creates the transform matrix for 2D space.
|
| properties | description |
| a,b,...,f | Matrix elements passed through the constructor. a element is the same as m11, b is the same as m12 and etc. |
| m11, m12,..., m44 | Matrix elements passed through the constructor. |
| is2D | Value is true, if matrix was initialized as a 2D matrix. Read only. |
| isIdentity | Value is true if the matrix is the identity matrix. Read only. |
| method | description |
| invertSelf() | Modifies the matrix by inverting it and returns itself. |
| multiplySelf(m) | Modifies the matrix by post-multiplying it with the specified matrix and returns itself. |
| preMultiplySelf(m) | Modifies the matrix by pre-multiplying it with the specified matrix and returns itself. |
| translateSelf([x [, y [, z]]) | Applies the specfied translation and returns itself. |
| rotateSelf(degZ) | Applies the specified rotation around the z-axis by angle degZ in degrees and returns this matrix and returns itself. |
| rotateSelf(degZ) | Applies the specified rotation around the z-axis by angle degZ in degrees and returns itself. |
|
rotateSelf( |
Applies the specified rotation and returns itself. |
|
scaleSelf( |
Applies the specfied scale, then applies the translation transform (-oX, -oY, -oZ) and returns itself. Parameters f* specify the scale factors on each axis, default value is 1. |
|
scale3DSelf( |
Applies the specfied scale, then applies the translation transform (-oX, -oY, -oZ) and returns itself. |
| skewXSelf(sX) | Applies the specified skew transformation along the X-axis and returns itself. Parameter sX is angle in degree. |
| skewYSelf(sY) | Applies the specified skew transformation along the Y-axis and returns itself. Parameter sY is angle in degree. |
| static members | |
| method | description |
| fromFloat32Array(vals) | Same as contructor (a,...,f) or (m11,...,m44). |
| fromFloat64Array(vals) | Same as contructor (a,...,f) or (m11,...,m44). |
There is a class DOMMatrixReadOnly in which properties a, ..., f and m11, ..., m44 are read only.
DOMPoint
The DOMPoint class represents a 3D point using homogeneous coordinates.
| constructor | description |
|---|---|
| DOMPoint([x [, y [, z [, w]]]]) | Creates new point. x, y, z by default are 0. w by default 1. |
| property | description |
| x | x coordinate of the point. |
| y | y coordinate of the point. |
| z | z coordinate of the point. |
| w | w coordinate of the point. Typically is 1, but can be changed after projection. |
There is a class DOMPointReadOnly in which properties are read only.
DOMRect
The DOMRect class represents a rectangular region an element occupies in the viewport. For example, the Element.getBoundingClientRect() method returns a DOMRect containing the position of the Element.
| constructor | description |
|---|---|
| DOMRect([x [, y [, width [, height]]]]) | Creates new rectangle. By default the x, y, width and height paramters are 0. |
| property | description |
| x | x coordinate of the rectangle. |
| y | y coordinate of the rectangle. |
| width | Width of the point. |
| height | Height of the point. |
There is a class DOMRectReadOnly in which properties are read only.
DOMRectList
The DOMRectList class represents a list of DOMRect objects associated with the object. For example, the Element.getClientRects() method returns a DOMRectList containing a list of DOMRects for each portion of the Element (the text can be split across multiple lines, thus you will get multiple rectangles).
It has a length property that indicates the number of rectangles.
You can get an item by index via the [] operator or the item(ind) method.
DOMRectList only exists for compatibility with legacy Web content. When specifying a new API, DOMRectList must not be used. Use sequence<DOMRect> instead.
DOMQuad
The DOMRect class represents a quadrilateral.
| constructor | description |
|---|---|
| DOMQuad([p1 [, p2 [, p3 [, p4]]]]) | Creates new quadrilateral. Parameters p* can be DOMPointReadOnly/DOMPoint objects. |
| property | description |
| p1, p2, p3, p4 | Specify points of the quadrilateral. |
| method | description |
| getBounds() | Returns a DOMRect object with the coordinates and dimensions of the DOMQuad object. |
| static members | |
| method | description |
| fromRect(rect) | Returns a new DOMQuad object based on the passed set of coordinates. |
| fromQuad(quad) | Returns a new DOMQuad object based on the passed set of coordinates. |
| toJSON() | Returns a JSON representation of the DOMQuad object. |