easing関数

canvasでオブジェクトの大きさを変えたい時とかにeasingを使いたくなることがある。
オブジェクトの運動は物理の式でまかなえるので、あまり頻繁には使わないけど。

上記ページに記載してある内容をいつも忘れるので、自分用に書き直しただけ。
必要な数値は以下。内容はたぶんあってるはず。

currentTime は変化が開始してからの経過時間。
startValue は初期値。
changeValue は初期値から変化させたい分の値。完了時の値ではない。
duration は変化が完了するまでに要する時間。

linear

var easingLinear = function (currentTime, startValue, changeValue, duration) {
  return changeValue * currentTime / duration + startValue;
};

easeInCubic

var easingEaseInCubic = function (currentTime, startValue, changeValue, duration) {
  currentTime /= duration;
  return changeValue * currentTime * currentTime * currentTime + startValue;
};

easeOutCubic

var easingEaseOutCubic = function (currentTime, startValue, changeValue, duration) {
  currentTime /= duration;
  currentTime--;
  return changeValue * (currentTime * currentTime * currentTime + 1) + startValue;
};

easeInExpo

var easingEaseInExpo = function (currentTime, startValue, changeValue, duration) {
  return changeValue * Math.pow(2, 10 * (currentTime / duration - 1)) + startValue;
};

easeOutExpo

var easingEaseOutExpo = function (currentTime, startValue, changeValue, duration) {
  return changeValue * (-1 * Math.pow(2, -10 * currentTime / duration) + 1) + startValue;
};