SVG にあるいくつかのパスの y 軸間の 3d 回転をエミュレートしようとしています。ライブラリ SVG3D https://code.google.com/p/svg3d/ を見つけて、試してみました。
問題は、ティック間隔の長さと各「ティック」の増分 (ラジアン単位) しか制御できないことです (回転を実行する transform() 関数を呼び出す setInterval タイミング関数があります)。
再生一時停止コマンドのように機能する toggleRotation 関数がありますが、パスのタイミングと回転を制御することはできません。
私のパスには次のサンプルコードがあります。
<g id="anim_container"
z:xOrigin="0"
z:yOrigin="0"
z:zRatio="1000"
z:sortAlgo="none"
z:rotationTime="60"
onload="init(this);">
<path
d="M 460.2203,600.93365 248.25964,263.59573 C 248.63437,272.77915 249.10289,281.86852 249.66521,290.86388 250.03994,298.54799 250.32105,306.70032 250.50856,315.32088 250.88328,323.75461 251.07069,331.251 251.07079,337.81007 L 251.07079,600.93365 203.28125,600.93365 203.28125,204.84271 265.68876,204.84271 479.89835,544.42955 C 479.33579,535.24653 478.77356,526.06345 478.21166,516.88029 477.83651,509.00916 477.4617,500.48202 477.0872,491.29883 476.71206,481.92845 476.52465,473.02649 476.52497,464.59291 L 476.52497,204.84271 524.87674,204.84271 524.87674,600.93365 460.2203,600.93365"
id="path_n">
<z:translation x="364.0790100097656" y="402.88818359375"/>
<z:rotation incRotY="0.5"/>
<z:translation x="-364.0790100097656" y="-402.88818359375"/>
</path>
</g>
では、オブジェクトの回転と速度を制御するにはどうすればよいでしょうか? 各回転の速度を制御するためのイージング関数を含めることは可能ですか?