text要素に他のテキスト系要素を子要素のテキストとして参照して描画
SVGでtext要素に他のテキスト系要素を子要素のテキストとして参照して描画するには、tref要素を使用します。
参照可能な要素は、text要素だけでなくtitle要素やdesc要素なども参照できます。
- ※ 2021年時点で対応しているブラウザはありません。
構文
<tref />属性
| 属性名 | 初期値 | 説明 |
|---|---|---|
| xlink:href | 対象要素のID名。 SVG 1.1の場合はこの属性を使用し、SVG 2からは非推奨となるのでhref属性を使用する。 |
|
| href | 対象要素のID名。 SVG 2からはこの属性を使用し、SVG 1.1まではxlink:href属性を使用する。 |
サンプルコードとデモ
XML
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 200 150" width="200" height="150">
<defs>
<text id="foo">かきくけこ</text>
</defs>
<text y="14">あいうえお<tref xlink:href="#foo" /></text>
</svg>