DOMMatrix: scale3dSelf() 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 in Web Workers.
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.
To 3D-scale a matrix without mutating it, see DOMMatrixReadOnly.scale3d()
, which creates a new scaled matrix while leaving the original unchanged.
Syntax
The scale3dSelf()
method is specified with zero to four values.
DOMMatrix.scale3dSelf();
DOMMatrix.scale3dSelf(scale);
DOMMatrix.scale3dSelf(scale, originX);
DOMMatrix.scale3dSelf(scale, originX, originY);
DOMMatrix.scale3dSelf(scale, originX, originY, originZ);
Parameters
scale
-
A multiplier; the scale value. If no scale is supplied, this defaults to
1
. If scale is not 1, theis2D
property of the current matrix is set tofalse
. originX
Optional-
An x-coordinate for the origin of the transformation. If no origin is supplied, this defaults to
0
. originY
Optional-
A y-coordinate for the origin of the transformation. If no origin is supplied, this defaults to
0
. originZ
Optional-
A z-coordinate for the origin of the transformation. If no origin is supplied, this defaults to
0
.
Return value
Returns itself; a DOMMatrix
.
Examples
const matrix = new DOMMatrix();
console.log(matrix.scale3dSelf(2).toString());
/* matrix3d(
2, 0, 0, 0,
0, 2, 0, 0,
0, 0, 2, 0,
0, 0, 0, 1) */
console.log(matrix.scale3dSelf(3.1, 25, 25, 1.25).toString());
/* matrix3d(
6.2, 0, 0, 0,
0, 6.2, 0, 0,
0, 0, 6.2, 0,
-105, -105, -5.25, 1) */
console.log(matrix.toString());
/* matrix3d(
6.2, 0, 0, 0,
0, 6.2, 0, 0,
0, 0, 6.2, 0,
-105, -105, -5.25, 1) (same as above) */
Specifications
Specification |
---|
Geometry Interfaces Module Level 1 # dom-dommatrix-scale3dself |
Browser compatibility
BCD tables only load in the browser
See also
DOMMatrixReadOnly.scale3d()
DOMMatrix.scaleSelf()
- CSS
transform
property and thescale3d()
andmatrix3d()
functions - CSS transforms module
- SVG
transform
attribute CanvasRenderingContext2D
interfacetransform()
method