If i had a tween with a running duration of 2000ms and i wanted to extract the tweened value at 1000ms, how would i go about doing this? I am using Tween.js @ http://github.com/sole/tween.js
var position = {y: 0};
t = new TWEEN.Tween(position)
.to({ y: 300 })
.onUpdate( function() {
console.log(position.y);
});
t.start(); // correctly runs the tween and logs tweened position.y values
now, from what i can gather, i should be able to to .update(tValue) and have it log the correct tweened value at the given tValue onUpdate. Instead, position.y only outputs the starting position value.
The first FAQ question of the Github page hints of this ability, but i can't seem to get it to work.
Thanks!
A quick look at the tween.js source reveals that it keeps all of its tweening functions in a Tween.Easing
"namespace", and the default easing function is TWEEN.Easing.Linear.EaseNone
.
Its easing functions are a little different than what I was expecting, but are pretty easy to use independent of the rest of the architecture, once you know what you want to do.
function getTweenedValue(startVal, endVal, currentTime, totalTime, tweener) {
var delta = endVal - startVal;
var percentComplete = currentTime/totalTime;
tweener ||= TWEEN.Easing.Linear.EaseNone;
return tweener(percentComplete) * delta + startVal
}
var val = getTweenedValue(0,300,1000,2000);
Something like that should work.
I just remembered I also had a related answer a while ago that talks more about the "theory" of easing/tweening functions if you are interested.