このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

SVGPolygonElement: animatedPoints プロパティ

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。

animatedPointsSVGPolygonElement インターフェイスの読み取り専用プロパティで、この要素の points 属性のアニメーションする値を反映します。 points 属性がアニメーションしない場合、このプロパティは points プロパティと同じ値を持ちます。

SVGPointList オブジェクトです。

animatedPoints プロパティへのアクセス

html
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="200">
  <polygon id="myPolygon" points="100,10 150,50 100,90 50,50" fill="blue">
    <animate
      attributeName="points"
      values="100,10 150,50 100,90 50,50; 150,10 200,50 150,90 100,50"
      dur="2s"
      repeatCount="indefinite" />
  </polygon>
</svg>
js
const polygonElement = document.getElementById("myPolygon");

// animatedPoints プロパティへのアクセス
console.dir(polygonElement.animatedPoints); // 出力: SVGPointList オブジェクト

仕様書

仕様書
Scalable Vector Graphics (SVG) 2
# __svg__SVGAnimatedPoints__animatedPoints

ブラウザーの互換性