SVGAnimatedRect: animVal-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Die schreibgeschützte Eigenschaft animVal der SVGAnimatedRect-Schnittstelle stellt den aktuellen animierten Wert des viewBox-Attributs eines SVG-Elements als schreibgeschütztes DOMRectReadOnly-Objekt dar. Sie ermöglicht den Zugriff auf den dynamischen Zustand des Rechtecks, einschließlich der Werte für x, y, width und height während der Animation.

Wenn keine Animation angewendet wird, spiegelt die animVal-Eigenschaft den Wert des viewBox-Attributs des SVG-Elements wider und wird mit SVGAnimatedRect.baseVal identisch sein.

Wert

Ein DOMRectReadOnly-Objekt, das den animierten Wert des viewBox-Attributs darstellt.

Beispiele

html
<svg viewBox="0 0 200 100" id="mySvg">
  <rect width="100" height="100" fill="blue" />
</svg>
js
const svgElement = document.getElementById("mySvg");
const animatedRect = svgElement.viewBox.animVal;

// Log the animated value (assuming an animation is applied)
console.log(animatedRect.x);
console.log(animatedRect.y);
console.log(animatedRect.width);
console.log(animatedRect.height);

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# __svg__SVGAnimatedRect__animVal

Browser-Kompatibilität

Siehe auch