9

<set>タグを使用して図形の回転角度を設定しようとしていますが、一生の間、それを理解できません。正しい構文は何ですか？

<set id="smallGearJump" 
         attributeName="transform" attributeType="XML" type="rotate" 
         to="110 100 100" begin="1s" dur="1.7s" />

編集：明確化-私はそれを特定の角度に設定された時間設定しようとしていますが、そこでアニメーション化するのではありません。0回転から110回転にジャンプさせたい（上記の例では）

4

4 に答える 4

2

animateTransform要素 notが必要ですanimate。必要に応じて、additiveおよびプロパティを変更することができます。fill

<animateTransform id="smallGearJump"
                attributeName="transform" attributeType="XML"
                type="rotate" to="110 100 100" dur="1.7s" begin="1s"
                additive="replace" fill="freeze" />

W3CまたはMDNのドキュメントを参照してください。

于 2012-03-25T13:04:38.750 に答える
1

アニメーションをある状態から別の状態にジャンプさせたい場合は、calcMode="discrete" を指定します。たとえば、次のようにします。

<animateTransform attributeName="transform" type="rotate" to="110 100 100" dur="1.7s" begin="1s"
            calcMode="discrete" />
于 2013-03-16T16:03:08.880 に答える
0

私は満足のいく答えを見つけることができませんでした。

私は最終的に次のようにコーディングしました：

  • 元の要素を<defs>
  • <use>要素を 2 つ作成します。1 つには回転を追加し、もう 1 つには回転を追加しません。
  • 要件に応じて、アニメーション中に2 つ<use>を表示または非表示に設定します

例：

<defs>
  <path id="example" d="..."/>
</defs>
<use xlink:href="#example" visibility="hidden">
  <set begin="0s" end="1s" attributeName="visibility" to="visible"/>
</use>
<use xlink:href="#example" visibility="hidden" transform="rotate(110 100 100)">
  <set begin="1s" end="3s" attributeName="visibility" to="visible"/>
</use>
于 2013-03-16T15:46:59.110 に答える