1. 開発者向けのウェブ技術
  2. SVG
  3. リファレンス
  4. 要素
  5. <animateTransform>

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

View in English Always switch to English

<animateTransform>

Baseline 広く利用可能

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

<animateTransform> は SVG の要素で、ターゲット要素に対して座標変換属性をアニメーションさせ、これにより平行移動、拡大縮小、回転、ゆがみなどのアニメーションを制御することができます。

使用コンテキスト

カテゴリーアニメーション要素
許可されている内容任意の数、任意の順序の以下の要素。
説明的要素

例

html
<svg
  width="120"
  height="120"
  viewBox="0 0 120 120"
  xmlns="http://www.w3.org/2000/svg">
  <polygon points="60,30 90,90 30,90">
    <animateTransform
      attributeName="transform"
      attributeType="XML"
      type="rotate"
      from="0 60 70"
      to="360 60 70"
      dur="10s"
      repeatCount="indefinite" />
  </polygon>
</svg>

属性

DOM インターフェイス

この属性は SVGAnimateTransformElement インターフェイスを提供します。

仕様書

仕様書
SVG Animations Level 2
# AnimateTransformElement

ブラウザーの互換性

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

GitHub でこのページを表示 • このコンテンツに関する問題を報告