Ease Out Cubic - Function Arguments Explanation
algorithm, animation, javascript, math
Solution
You're right, `d` is for duration and `t` is current time. Therefore, `t` should be from `0` to `d`.
`c` is a total change, should be equal to `end value` - `start value`.
- For `t = 0` we have `c*(-1 + 1) + b` or `b`
- For `t = d` we have `c*(0 + 1) + b` or `b + c`
Function would be the same for any fps, it's up to you how frequently update position and call the function.
Problem
On this great web page I found a list of easing algorithms that can add nice visual appeal to my webpages. Despite, I found there brief mention of the function arguments (see below), the algorithm does not behave as I would wish. Can I kindly ask for explanation on what values/ranges should be entered into the arguments of the function below mentioned? Argument list: - t: current time - should here be values 0...1, or real number of the current frame? - b: start value - I assume, a start X or Y coordinate of the object being moved - c: change in value - can here be number 1 all the time for all the frames? - d: duration - the number of frames altogether? ``` Math.easeOutCubic = function (t, b, c, d) { t /= d; t--; return c*(t*t*t + 1) + b; }; ``` Should the values be incrementally added to the last value obtained from the function, or should they be added to the initial 0 position?