SVGTextContentElement: getExtentOfChar() メソッド
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。
getExtentOfChar() は SVGTextContentElement インターフェイスのメソッドで、指定されたタイポグラフィ文字に対応するグリフセルの最小の境界ボックスの計算値を表します。
構文
js
getExtentOfChar(index)
引数
index-
integerです。文字のインデックスです。
返値
DOMRect オブジェクトです。指定された文字の最小の境界ボックスです。
例外
IndexSizeErrorDOMException-
indexの位置に文字がなかった場合に発生します。
例
文字の範囲の取得
html
<svg width="300" height="100">
<text id="exampleText" x="10" y="50" font-size="16">Hello, SVG World!</text>
</svg>
js
const textElement = document.getElementById("exampleText");
// インデックス 0 （最初の文字）の文字の範囲（境界ボックス）を取得します。
const extent = textElement.getExtentOfChar(0);
// 先頭文字の境界ボックス
console.dir(extent); // 出力: DOMRect { x: 10, y: 38, width: 11.55, height: 16 }
仕様書
| 仕様書 |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGTextContentElement__getExtentOfChar |