SVGTransform
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.
SVG transform interface
SVGTransform
is the interface for one of the component transformations within an SVGTransformList
; thus, an SVGTransform
object corresponds to a single component (e.g., scale(…)
or matrix(…)
) within a transform
attribute.
An SVGTransform
object can be designated as read only, which means that attempts to modify the object will result in an exception being thrown.
Interface overview
Also implement | None |
---|---|
Methods |
|
Properties |
|
Constants |
|
Normative document | SVG 1.1 (2nd Edition) |
Constants
Name | Value | Description |
---|---|---|
SVG_TRANSFORM_UNKNOWN |
0 | The unit type is not one of predefined unit types. It is invalid to attempt to define a new value of this type or to attempt to switch an existing value to this type. |
SVG_TRANSFORM_MATRIX |
1 | A matrix(…) transformation |
SVG_TRANSFORM_TRANSLATE |
2 | A translate(…) transformation |
SVG_TRANSFORM_SCALE |
3 | A scale(…) transformation |
SVG_TRANSFORM_ROTATE |
4 | A rotate(…) transformation |
SVG_TRANSFORM_SKEWX |
5 | A skewx(…) transformation |
SVG_TRANSFORM_SKEWY |
6 | A skewy(…) transformation |
Instance properties
Name | Type | Description |
---|---|---|
type |
unsigned short | The type of the value as specified by one of the SVG_TRANSFORM_* constants defined on this interface. |
angle |
float |
A convenience attribute for SVG_TRANSFORM_ROTATE ,
SVG_TRANSFORM_SKEWX and SVG_TRANSFORM_SKEWY .
It holds the angle that was specified.For SVG_TRANSFORM_MATRIX ,
SVG_TRANSFORM_TRANSLATE and
SVG_TRANSFORM_SCALE , angle will be zero.
|
matrix |
DOMMatrix |
The matrix that represents this transformation. The matrix object is
live, meaning that any changes made to the
|
Instance methods
Name & Arguments | Return | Description |
---|---|---|
setMatrix(in
|
void |
Sets the transform type to Exceptions:
|
setTranslate(in float tx, in float
ty)
|
void |
Sets the transform type to Exceptions:
|
setScale(in float sx, in float
sy)
|
void |
Sets the transform type to Exceptions:
|
setRotate(in float angle, in float
cx, in float cy)
|
void |
Sets the transform type to Exceptions:
|
setSkewX(in float angle)
|
void |
Sets the transform type to Exceptions:
|
setSkewY(in float angle)
|
void |
Sets the transform type to Exceptions:
|
Specifications
Specification |
---|
Scalable Vector Graphics (SVG) 2 # InterfaceSVGTransform |
Browser compatibility
BCD tables only load in the browser