SVGTransform: angle property - Web APIs | MDN

Value

An integer; the angle value in degrees as a float.

Examples

Accessing the angle property

html

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
  <rect id="rect" x="50" y="50" width="100" height="100" fill="green" />
</svg>

js

const rect = document.getElementById("rect");
const transformList = rect.transform.baseVal;

// Create and add a rotation transform
const rotateTransform = rect.ownerSVGElement.createSVGTransform();
rotateTransform.setRotate(45, 100, 100); // Rotate 45 degrees
transformList.appendItem(rotateTransform);

// Access the angle property
console.log(transformList.getItem(0).angle); // Output: 45

Specifications

Specification
Scalable Vector Graphics (SVG) 2
# __svg__SVGTransform__angle

Browser compatibility

Help improve MDN

Learn how to contribute

This page was last modified on by MDN contributors.