svg - svgパスに沿って特定のパーセンテージでオブジェクトを配置しますか？

Question

現在、この<animateMotion>要素を使用して、オブジェクト（パスで定義）を正しい終了位置にすばやくアニメーション化しています。これはChromeで正常に表示されており、Batikで動作させるように取り組んでいません。

しかし、私は興味があります：アニメートせずにこれを行うためのより良い方法はありますか？<path>？の長さに沿って（たとえば80％で）描画するだけです。

Answer 1

静的なsvgイメージを作成する場合は、オブジェクトを配置する場所を事前に正確に知っておく必要があります。たとえば、transform属性を使用して、オブジェクトを目的の場所に配置できます。

オブジェクトを配置する場所を事前に知らずにそれを行っている場合は、javascriptを使用できます。getPointAtLengthメソッドは、指定された長さのオフセットでパス上のポイントを提供します。getTotalLengthを呼び出すことにより、計算されたパスの全長を照会できます。