SVGPointList
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
SVGPointList インターフェイスは、 SVGPoint オブジェクトのリストを表します。
SVGPointList オブジェクトは読み取り専用として指定することができます。すなわち、オブジェクトを変更しようとすると例外が発生するようにすることができます。
インスタンスプロパティ
SVGPointList.length読取専用-
リスト内のアイテム数を返します。
SVGPointList.numberOfItems読取専用-
リスト内のアイテム数を返します。
インスタンスメソッド
SVGPointList.clear()-
リスト内のすべてのアイテムを除去します。
SVGPointList.initialize()-
まずリスト内のすべてのアイテムを除去し、そのリストに単一の値を追加します。
SVGPointList.getItem()-
リストから指定した位置のアイテムを取得します。
SVGPointList.insertItemBefore()-
要素をリストの指定した位置に挿入します。
SVGPointList.replaceItem()-
リスト内のアイテムを新しいアイテムで置き換えます。
SVGPointList.removeItem()-
リストからアイテムを除去します。
SVGPointList.appendItem()-
アイテムをリストの末尾に追加します。
例
次の例では、 SVG の中に 5 つの座標ペアを持つ <polyline> があります。 points プロパティは SVGPointList を返します。
html
<svg viewBox="-10 -10 120 120" xmlns="http://www.w3.org/2000/svg">
<polyline
id="example"
stroke="black"
fill="none"
points="50,0 21,90 98,35 2,35 79,90" />
</svg>
js
let example = document.getElementById("example");
console.log(example.points); // SVGPointList
仕様書
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # InterfaceSVGPointList |