Baseline Widely available
The baseVal
property of the SVGAnimatedNumber
interface represents the base (non-animated) value of an animatable numeric attribute.
Some animatable SVG attributes accept a single numeric value, such as the radius
attribute of the <circle>
or <ellipse>
elements and the width
and height
attributes of the <rect>
element, and many others. The baseVal
property reflects and updates the base, or non-animated, value of the numeric attribute.
A number
; the base value of the attribute as a float.
This example includes a <path>
element with a nested <animate>
element that animates the value of the path's pathLength
attribute:
<path d="M 0,40 h100" pathLength="90" id="path">
<animate
attributeName="pathLength"
values="50; 90; 50;"
dur="10s"
repeatCount="indefinite" />
</path>
const path = document.querySelector("path");
console.log(path.pathLength.baseVal); // output: 90
path.pathLength.baseVal = 50; // updates the value
console.log(path.pathLength.baseVal); // output: 90
The baseVal
reflect that value of the pathLength
attribute. We also use the baseVal
property to access the base (non-animating) value of the animating pathLength
.
To access the current value of the pathLength
value as it animates, use the SVGAnimatedNumber.animVal
property.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4