SVGAnimatedTransformList.animVal プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

animVal は SVGAnimatedTransformList インターフェイスの読み取り専用プロパティで、 SVG 要素の transform 属性のアニメーションする値を表します。

このプロパティは、SVG 要素の transform 属性、 <linearGradient> または <radialGradient> 要素の gradientTransform 属性、 <pattern> 要素の patternTransform 属性を、読み取り専用の SVGTransformList として反映し、アニメーション中の各座標変換関数に対して動的に更新された SVGTransform にアクセスできるように指定します。アニメーションがアクティブでない場合、このプロパティは baseVal と同じ値を返します。

値

SVGTransformList オブジェクトで、 transform 属性のアニメーション中の値を表します。

例

// 長方形の要素を取得
const rect = document.querySelector("rect");

// 座標変換のアニメーションリストにアクセス（もしあれば）
const animTransforms = rect.transform.animVal;

// アニメーションする座標変換をコンソールにログ出力
console.dir(animTransforms);