SVGTransformList: appendItem() メソッド
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.
appendItem() は SVGTransformList インターフェイスのメソッドで、リストの末尾に新しいアイテムをを追加します。
挿入されるアイテムはアイテムそのものであり、コピーではありません。
newItemがすでにリスト内に存在する場合は、このリストに挿入される前に、以前のリストから除去されます。
構文
js
appendItem(newItem)
引数
newItem-
リストに追加する
SVGTransformです。
返値
リストに追加された SVGTransform オブジェクトです。
例外
NoModificationAllowedErrorDOMException-
SVGTransformListが読み取り専用属性に対応する場合、またはオブジェクト自体が読み取り専用である場合に発生します。
例
新しい座標変換の追加
html
<svg width="200" height="200">
<rect width="100" height="100" fill="red" />
</svg>
js
const svgElement = document.querySelector("svg");
const rectElement = svgElement.querySelector("rect");
// <rect> 要素の座標変換リストへのアクセス
const transformList = rectElement.transform.baseVal;
// 新しい座標変換の作成
const svgTransform = svgElement.createSVGTransform();
svgTransform.setTranslate(50, 50);
// 新しい座標変換をリストへ追加
const appendedTransform = transformList.appendItem(svgTransform);
console.dir(appendedTransform); // 出力: SVGTransform { type: 2, matrix: SVGMatrix, angle: 0 }
console.log(`Total number of transformations: ${transformList.numberOfItems}`); // 出力: 1
仕様書
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGNameList__appendItem |