A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from http://developer.mozilla.org/en-US/docs/Web/API/SVGGraphicsElement/transform below:

SVGGraphicsElement: transform property - Web APIs

SVGGraphicsElement: transform property

Baseline Widely available

The transform read-only property of the SVGGraphicsElement interface reflects the computed value of the transform property and its corresponding transform attribute of the given element.

Value

An SVGAnimatedTransformList object.

Examples Accessing the transform Property
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200">
  <!-- Rectangle with a transformation applied -->
  <rect
    id="rect1"
    x="50"
    y="50"
    width="100"
    height="100"
    fill="blue"
    transform="translate(20, 30) rotate(45)" />
</svg>
// Access the SVG element
const rect = document.getElementById("rect1");

// Get the transform list
const transformList = rect.transform.baseVal;

// Iterate through and log each transformation
for (let i = 0; i < transformList.numberOfItems; i++) {
  const transform = transformList.getItem(i);
  console.log(`Type: ${transform.type}, Matrix: ${transform.matrix}`);
}
// Example output:
// Type: 2 (SVG_TRANSFORM_TRANSLATE), Matrix: SVGMatrix { ... }
// Type: 4 (SVG_TRANSFORM_ROTATE), Matrix: SVGMatrix { ... }
Specifications Browser compatibility

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4