SVGAnimatedNumber: thuộc tính baseVal
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Thuộc tính baseVal của giao diện SVGAnimatedNumber đại diện cho giá trị cơ sở (không hoạt hình) của một thuộc tính số có thể hoạt hình.
Một số thuộc tính SVG có thể hoạt hình chấp nhận một giá trị số đơn, chẳng hạn như thuộc tính radius của phần tử <circle> hoặc <ellipse>, các thuộc tính width và height của phần tử <rect>, và nhiều thuộc tính khác. Thuộc tính baseVal phản ánh và cập nhật giá trị cơ sở, hoặc không hoạt hình, của thuộc tính số.
Giá trị
Một number; giá trị cơ sở của thuộc tính dưới dạng số thực dấu phẩy động.
Ví dụ
Ví dụ này bao gồm một phần tử <path> với một phần tử <animate> lồng nhau hoạt hình giá trị của thuộc tính pathLength của đường dẫn:
<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); // đầu ra: 90
path.pathLength.baseVal = 50; // cập nhật giá trị
console.log(path.pathLength.baseVal); // đầu ra: 90
baseVal phản chiếu giá trị của thuộc tính pathLength. Chúng ta cũng sử dụng thuộc tính baseVal để truy cập giá trị cơ sở (không hoạt hình) của pathLength đang hoạt hình.
Để truy cập giá trị hiện tại của pathLength khi nó hoạt hình, hãy sử dụng thuộc tính SVGAnimatedNumber.animVal.
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGAnimatedNumber__baseVal |