search

mrdoob / three.js

JavaScript 3D Library.
https://threejs.org/
MIT License
101.98k stars 35.33k forks source link

animation.play #6331

Closed RemusMar closed 9 years ago

RemusMar commented 9 years ago

The current approach ( animation.play(startTime) ) is a little bit primitive. It would be very useful to have the method available in most of the popular 3D engines:

animation.play( startTime, endTime, loop );

where loop = true or false. cheers

mrdoob commented 9 years ago

Could you elaborate a bit?

RemusMar commented 9 years ago

Hi Ricardo, What do you want me to elaborate. Please check out the "dog" in this benchmark: http://necromanthus.com/Test/html5/test7.html I don't like the workaround with testing animation.currentTime in order to perform other actions. That's a waste of processing power anyway. The solution is animation.play( startTime, endTime, loop ) Unreal Engine 4, Unity3D, Shockwave 3D, etc

cheers

mrdoob commented 9 years ago

Ah, I think I know what you mean... Maybe this?

animation.playRange( startTime, endTime, loop );
RemusMar commented 9 years ago

Yes, Ricardo, to play the animation in the "endTime - startTime" range. This is a MUST if the animation contains sequences of animations (they don't have any name).

Another great feature (present in those 3D engines) is the 4th parameter: animation.play( startTime, endTime, loop, interpolationTime ); What does that "interpolationTime" do? When the command is launched the current keyFrame and the "startTime" frame are stored. If the interpolationTime is set to 500ms (for example), the engine will compute the animation frames between those frames for 500ms (depending on the animation speed). In this way, the transition to the new animation sequence will be very smooth.

cheers

mrdoob commented 9 years ago

Sounds good to me! Would you up for giving it a go at implementing it?

RemusMar commented 9 years ago

I can try, that's for sure. cheers

RemusMar commented 9 years ago

A fast solution for animation.play( startTime, endTime) is to change "max" with "min" here:

this.endTime = Math.min( keys[keys.length - 1].time, this.endTime );

And to define this.endTime = 0; in KeyFrameAnimation.js

RemusMar commented 9 years ago

I'm still busy with some Easter guests, but I'll get back to this asap. In any case, it would be better to be modified and improved by the author(s). It's a matter of vision ...