SVGUseElement: height-Eigenschaft
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Die schreibgeschützte Eigenschaft height des SVGUseElement-Interfaces beschreibt die Höhe des referenzierten Elements als SVGAnimatedLength. Sie spiegelt den berechneten Wert des height-Attributs auf dem <use>-Element wider.
Der Attributwert ist ein \<length>, \<percentage> oder \<number>. Der numerische Wert des SVGAnimatedLength.baseVal ist die Höhe des referenzierten Elements im Benutzerkoordinatensystem.
Wert
Ein SVGAnimatedLength.
Beispiele
Angenommen, folgendes SVG:
html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<defs>
<circle id="circle1" cx="50" cy="50" r="40" fill="blue" />
<circle id="circle2" cx="50" cy="50" r="40" fill="red" />
</defs>
<use x="50%" y="50%" href="#circle1" height="50" />
<use x="25%" y="50%" href="#circle2" height="100" />
</svg>
Wir können auf die berechneten Werte der height-Attribute zugreifen:
js
const uses = document.querySelectorAll("use");
const heightUse1 = uses[0].height;
const heightUse2 = uses[1].height;
console.log(heightUse1.baseVal.value); // output: 50
console.log(heightUse2.baseVal.value); // output: 100
Spezifikationen
| Spezifikation |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGUseElement__height |