Interface SVGTransform

The SVGTransform interface reflects 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.

MDN Reference

interface SVGTransform {
    angle: number;
    matrix: DOMMatrix;
    SVG_TRANSFORM_MATRIX: 1;
    SVG_TRANSFORM_ROTATE: 4;
    SVG_TRANSFORM_SCALE: 3;
    SVG_TRANSFORM_SKEWX: 5;
    SVG_TRANSFORM_SKEWY: 6;
    SVG_TRANSFORM_TRANSLATE: 2;
    SVG_TRANSFORM_UNKNOWN: 0;
    type: number;
    setMatrix(matrix?: DOMMatrix2DInit): void;
    setRotate(angle: number, cx: number, cy: number): void;
    setScale(sx: number, sy: number): void;
    setSkewX(angle: number): void;
    setSkewY(angle: number): void;
    setTranslate(tx: number, ty: number): void;
}
Index

Properties

angle matrix SVG_TRANSFORM_MATRIX SVG_TRANSFORM_ROTATE SVG_TRANSFORM_SCALE SVG_TRANSFORM_SKEWX SVG_TRANSFORM_SKEWY SVG_TRANSFORM_TRANSLATE SVG_TRANSFORM_UNKNOWN type

Methods

setMatrix setRotate setScale setSkewX setSkewY setTranslate

Properties

angle: number

The angle read-only property of the SVGTransform interface represents the angle of the transformation in degrees.

MDN Reference

matrix: DOMMatrix

The matrix read-only property of the SVGTransform interface represents the transformation matrix that corresponds to the transformation type.

MDN Reference

SVG_TRANSFORM_MATRIX: 1
SVG_TRANSFORM_ROTATE: 4
SVG_TRANSFORM_SCALE: 3
SVG_TRANSFORM_SKEWX: 5
SVG_TRANSFORM_SKEWY: 6
SVG_TRANSFORM_TRANSLATE: 2
SVG_TRANSFORM_UNKNOWN: 0
type: number

The type read-only property of the SVGTransform interface represents the type of transformation applied, specified by one of the SVG_TRANSFORM_* constants defined on this interface.

MDN Reference

Methods

  • The setMatrix() method of the SVGTransform interface sets the transform type to SVG_TRANSFORM_MATRIX, with parameter matrix defining the new transformation.

    MDN Reference

    Parameters

    Returns void

  • The setRotate() method of the SVGTransform interface sets the transform type to SVG_TRANSFORM_ROTATE, with parameter angle defining the rotation angle and parameters cx and cy defining the optional center of rotation.

    MDN Reference

    Parameters

    • angle: number
    • cx: number
    • cy: number

    Returns void

  • The setScale() method of the SVGTransform interface sets the transform type to SVG_TRANSFORM_SCALE, with parameters sx and sy defining the scale amounts.

    MDN Reference

    Parameters

    • sx: number
    • sy: number

    Returns void

  • The setSkewX() method of the SVGTransform interface sets the transform type to SVG_TRANSFORM_SKEWX, with parameter angle defining the amount of skew along the X-axis.

    MDN Reference

    Parameters

    • angle: number

    Returns void

  • The setSkewY() method of the SVGTransform interface sets the transform type to SVG_TRANSFORM_SKEWY, with parameter angle defining the amount of skew along the Y-axis.

    MDN Reference

    Parameters

    • angle: number

    Returns void

  • The setTranslate() method of the SVGTransform interface sets the transform type to SVG_TRANSFORM_TRANSLATE, with parameters tx and ty defining the translation amounts.

    MDN Reference

    Parameters

    • tx: number
    • ty: number

    Returns void

Settings

Member Visibility

On This Page

Properties
Methods