SVGPointList: insertItemBefore() メソッド

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.

insertItemBefore()SVGPointList インターフェイスのメソッドで、をリスト内の他のアイテムの前に挿入します。

構文

js
insertItemBefore(obj, index)

引数

obj

挿入される点の座標が入っている SVGPoint オブジェクトです。

index

オブジェクトをその前に挿入するアイテムのインデックスです。渡されたインデックスがリストの長さを上回る場合、インデックスはリストの長さに設定され、アイテムはリスト内の末尾のアイテムの前に挿入されます。

返値

挿入された SVGPoint オブジェクトです。

例外

NoModificationAllowedError DOMException

リストが読み取り専用である場合に発生します。

次の例では、 SVG の中に 5 つの座標ペアを持つ <polyline> があります。新しい SVGPoint が作成され、インデックス 2 の位置の前にその点を挿入します。

html
<svg id="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");
let svgPoint = document.getElementById("svg").createSVGPoint();
svgPoint.y = 10;
svgPoint.x = 10;
console.log(example.points.insertItemBefore(svgPoint, 2));

仕様書

Specification
Scalable Vector Graphics (SVG) 2
# __svg__SVGNameList__insertItemBefore

ブラウザーの互換性