SVGTransformList: initialize() method

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨July 2015⁩.

The initialize() method of the SVGTransformList interface clears all existing current items from the list and re-initializes the list to hold the single item specified by the parameter.

If the inserted item is already in a list, it is removed from its previous list before it is inserted into this list. The inserted item is the item itself and not a copy.

Syntax

js
initialize(newItem) 

Parameters

newItem

An SVGTransform item that is inserted into the list.

Return value

An SVGTransform object; the item inserted into the list.

Exceptions

NoModificationAllowedError DOMException

Thrown if SVGTransformList corresponds to a read-only attribute or when the object itself is read-only.

Examples

Re-initializing the Transform List with a New Transformation

html
<svg width="200" height="200" id="mySvg"> <rect width="100" height="100" fill="blue" /> </svg> 
js
const svgElement = document.querySelector("svg"); const rectElement = svgElement.querySelector("rect"); // Access the transform list of the <rect> element const transformList = rectElement.transform.baseVal; // Apply an initial translate transformation to the <rect> element const translateTransform = svgElement.createSVGTransform(); translateTransform.setTranslate(50, 50); transformList.appendItem(translateTransform); // Number of transformations before initialization console.log( `Number of transformations before initialization: ${transformList.length}`, ); // Output: 1 // Create a new scale transformation const scaleTransform = svgElement.createSVGTransform(); scaleTransform.setScale(2, 2); // Initialize the list with the new scale transform transformList.initialize(scaleTransform); // Number of transformations after initialization console.log( `Number of transformations after initialization: ${transformList.length}`, ); // Output: 1 

Specifications

Specification
Scalable Vector Graphics (SVG) 2
# __svg__SVGNameList__initialize

Browser compatibility

See also