M#、#L#、# M#、#L#、# で定義された多くのセグメントで構成される複雑な SVG パスがあります。このパスの描画をアニメーション化したいと思いますが、リストされている順序で。私はここにリストされている解決策を試しました: Can't make paths draw grows slow with D3 , but they draw the each segment of the path in parallel. 順番にアニメーション化されるようにこれを変更するにはどうすればよいですか?
2 に答える
2
D3 トランジションにはdelay()、アニメーションをいつ開始するかを指定できる機能があります。これを使用して、前のパス セグメントが描画された後で、連続するパス セグメントの描画を開始できます。トランジションのendイベントを使用して、前のトランジションが終了した後に次のトランジションを開始することもできます。この方法では、遅延を指定する必要さえありません。
または、Javascript を使用せずに SVG 自体でパスをアニメーション化することもできます。この例については、こちらを参照してください。基本的に必要なことは、描画方法を示すanimate要素を に追加することだけです。path
于 2013-07-06T19:35:19.170 に答える