MMD on WebGL カメラとライトと表情のモーションに対応（あと補間曲線について） - by edvakf in hatena
タイトルの通りです。VMD を読み込んだり、CoffeeScript で全部書きなおしてたりしたら時間がかかってしまいました。 http://edv.sakura.ne.jp/mmd/ （10月16日現在、開くと動き始めるはずです） ここからが本題。 補間曲線について MMD の補間曲線はベジエ曲線で、ベジエ曲線に必要な4つの点のうち、最初と最後が固定されている。すなわち、 こんな感じ。 を表す4つの数字は VMD ファイルに0から127までの整数として記録されていて、これらを127で割ってそれぞれの座標とする。 また、例えば登録されているキーフレームが10と20だったとして、13番目のフレームを描画したいとすると、 となる。 この5つの数字からまず を求め、次に を求めるのだが、 を求めるためには三次方程式を解かなければいけない。 幸いにして、この は常に（ によらず）単調増加らしい。厳
CSS3 のベジエ曲線のアニメーションを実装してみたい - melpon日記 - HaskellもC++もまともに扱えないへたれのページ
CSS3 の ease-in や ease-out は結構綺麗なので、あの動きを実装してみようかなーと思ったわけです。 CSS3 のベジエ曲線は３次曲線なので４点が必要ですが、最初の点と最後の点は固定値なので、指定するのは２番目と３番目の位置だけです。 Ceaser - CSS Easing Animation Tool - Matthew Lein がすごく分かりやすい。 で、３次のベジエ曲線の計算式は らしいです。 で、CSS3 では と というのは固定で、,,, の範囲も決まっているので、 となります。 ただこの式を直接使えばいいかというとそうではなくて、CSS3 ではX軸を時間軸として、Y軸を結果の軸として使っているので、 から を求め、その求めた から を求める必要があります。 ということで を３次方程式として求めて を出せばいいかなと思い、ちょっと解の公式をググってみると何かい
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Ceaser - CSS Easing Animation Tool - Matthew Lein
