SVGAnimatedPreserveAspectRatio: baseVal 屬性
SVGAnimatedPreserveAspectRatio 介面的只讀屬性 baseVal 代表 SVG 元素的 preserveAspectRatio 屬性的基礎（非動畫）值。
值
一個 SVGPreserveAspectRatio 物件。
示例
考慮以下 SVG
html
<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>
此示例定義了一個 <image> 元素，該元素會為其 preserveAspectRatio 屬性設定動畫。動畫會執行一次，並將 fill 屬性設定為 "freeze"，因此動畫效果在動畫完成後會持續存在。
我們在頁面載入時立即執行以下程式碼
js
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)
如果在動畫完成後再次記錄 animVal.meetOrSlice 和 baseVal.meetOrSlice 的值，我們將看到以下內容
js
console.log(baseVal.meetOrSlice); // Output: 1 (SVG_MEETORSLICE_MEET)
console.log(animVal.meetOrSlice); // Output: 2 (SVG_MEETORSLICE_SLICE)
請注意，如果我們設定 fill 為 "remove"（或者完全移除 fill，因為 "remove" 是預設值），那麼動畫效果將在動畫完成後被移除，此時 animVal.meetOrSlice 將恢復為 1。
規範
| 規範 |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGAnimatedPreserveAspectRatio__baseVal |
瀏覽器相容性
載入中…