DOMMatrix: rotateFromVectorSelf() method
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Note: This feature is available inWeb Workers.
TherotateFromVectorSelf()
method of theDOMMatrix
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)
. Ifx
andy
are both0
, the angle is specified as0
, and the matrix is not altered.
To rotate a matrix from a vector without mutating it, seeDOMMatrixReadOnly.rotateFromVector()
, which creates a new rotated matrix while leaving the original unchanged.
In this article
Syntax
rotateFromVectorSelf()rotateFromVectorSelf(rotX)rotateFromVectorSelf(rotX, rotY)
Parameters
rotX
OptionalA number; The x-coordinate of x,y vector that determines the rotation angle. If undefined,
0
is used.rotY
OptionalA number; The y-coordinate of x,y vector that determines the rotation angle. If undefined,
0
is used.
Return value
Returns itself; the updatedDOMMatrix
.
Examples
const matrix = new DOMMatrix(); // create a matrixconsole.log(matrix.rotateFromVectorSelf().toString());// output: matrix(1, 0, 0, 1, 0, 0) (no rotation applied)console.log(matrix.rotateFromVectorSelf(10, 20).toString());// output: matrix(0.447, 0.894, -0.894, 0.447, 0, 0)console.log(matrix.toString());// output: matrix(0.447, 0.894, -0.894, 0.447, 0, 0) (same as above)
Specifications
Specification |
---|
Geometry Interfaces Module Level 1> # dom-dommatrix-rotatefromvectorself> |
Browser compatibility
Loading…
See also
DOMMatrixReadOnly.rotateFromVector()
DOMMatrix.rotateSelf()
DOMMatrix.rotateAxisAngleSelf()
- CSS
transform
property androtate3d()
function - CSS
rotate
property - CSS transforms module
- SVG
transform
attribute CanvasRenderingContext2D
interface androtate()
method