このエントリーは、アニメーション・モーションを JavaScript で記述するための覚え書きです。いままで実務で使ってきたわざをちょっと整理してみます。 まずは、モーション設計をする上でよく使う三角関数について、おさらいとして触れます。もっともぼくは数学の素養は乏しいので、あやしいところもあるかもしれません。 三角関数おさらい 三角関数を使うと、直角三角形のある角の大きさが定まった時の、各線の長さを求めることができます。 図のように、角度θの時の底辺の長さはsin(θ)、高さはcos(θ)になります。 例えばθが45°の時は cos(30°) ≓ 0.707 sin(30°) ≓ 0.707(1 : 1 : √2) 60°(上の図)の時は cos(60°) = 0.5 sin(60°) ≓ 0.8660(1 : 2 : √3 ですね) 90°(垂直線)の時は cos(90°) = 0 s