SVGAnimatedPreserveAspectRatio: baseVal-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 baseVal-Schreibgeschützte Eigenschaft der SVGAnimatedPreserveAspectRatio-Schnittstelle repräsentiert den Basiswert (nicht animiert) des preserveAspectRatio-Attributs eines SVG-Elements.
Wert
Ein SVGPreserveAspectRatio-Objekt.
Beispiele
Betrachten Sie das folgende SVG:
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<image
id="myImage"
href="crows.jpg"
width="50"
height="50"
preserveAspectRatio="xMinYMin meet">
<animate
attributeName="preserveAspectRatio"
from="xMinYMin meet"
to="xMaxYMax slice"
dur="5s"
fill="freeze"
repeatCount="1" />
</image>
</svg>
Dieses Beispiel definiert ein <image>-Element, das sein preserveAspectRatio-Attribut animiert. Die Animation läuft einmal und setzt das fill-Attribut auf "freeze", sodass der Effekt der Animation nach dem Abschluss der Animation beibehalten wird.
Wir führen den folgenden Code sofort aus, wenn die Seite geladen wird:
const image = document.querySelector("#myImage");
const baseVal = image.preserveAspectRatio.baseVal;
const animVal = image.preserveAspectRatio.animVal;
console.log(baseVal.meetOrSlice); // Output: 1 (SVG_MEETORSLICE_MEET)
console.log(animVal.meetOrSlice); // Output: 1 (SVG_MEETORSLICE_MEET)
Wenn wir die Werte von animVal.meetOrSlice und baseVal.meetOrSlice erneut protokollieren, nachdem die Animation abgeschlossen ist, sehen wir Folgendes:
console.log(baseVal.meetOrSlice); // Output: 1 (SVG_MEETORSLICE_MEET)
console.log(animVal.meetOrSlice); // Output: 2 (SVG_MEETORSLICE_SLICE)
Beachten Sie, dass wenn wir fill auf "remove" setzen (oder fill ganz entfernen, da "remove" der Standard ist), die Animationseffekte entfernt werden, wenn die Animation abgeschlossen ist, und animVal.meetOrSlice dann wieder auf 1 zurückgeht.
Spezifikationen
| Spezifikation |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGAnimatedPreserveAspectRatio__baseVal |