AnimationMixer AnimationClip, AnimationAction missing in doc

[dolanmiu]

Could someone point me to the docs to AnimationMixer AnimationClip, AnimationAction, AnimationLoader, AnimationUtils etc?

I think they are missing.

P.S. I tried googling as well. The only resource I can find about AnimationMixer is from the examples.

[mrdoob]

Yes. Documentation for these classes is pending.

[dolanmiu]

Ok, thats fine

Could you in the meantime tell me how to start and stop animations with AnimationMixer? (I cant find any resource on this)

The only resource I have is this example:

http://threejs.org/examples/#webgl_animation_scene

Which I've got working, it works great, but it loops. I need to control when the animation starts

[mrdoob]

I'm afraid I know as much as you do at the moment.

[dolanmiu]

But the last commit of all the AnimationXXX classes were 3 months ago!

[mrdoob]

Yep. I haven't been able to study that part of the code yet.

[dolanmiu]

I could maybe write some documentation for it from analysing it. But from a brief glance, it does not contain any play(), stop() methods

Where do I begin?

[mrdoob]

/ping @bhouston

[jee7]

I would also like some updated documentation on the matter. Until then I think this example is a better resource for finding out, how the new system works: http://threejs.org/examples/#webgl_animation_skinning_blending Especially the BlendCharacter example class: http://threejs.org/examples/js/BlendCharacter.js

If you want to stop an animation action, then remove it from the mixer. If you want to play it, then call the mixer's play(action, optionalFadeInDuration) method, which calls addAction(action) underneath. Although I guess you could implement also a stop(action), which would call removeAction(action) underneath.

Alternatively you could set the weight for the action as 0 if you want to stop it (and 1 if you want to play it). This is actually how I did it too. I had 3 animation actions (idle, walk and run) and if the movement speed was above some value, I assigned 0 to the weights of idle and walk, and 1 to run. If the movement speed was below that value, I blended the animations together using mixed weights (needs also time synchronization).

[tschw]

@dolanmiu Is this question about r73 or r74dev?

The development branch contains a revised API with some inline documentation and revised examples. The webgl_animation_skinning_morph example demonstrates the use of the (not necessarily fully stable) animation control API.

@jee7

Although I guess you could implement also a stop(action), which would call removeAction(action) underneath.

This answer seems to be about the r73 version.

By now the usage has become a lot more straightforward and you actually simply call action.play() and action.stop(). The new version of the mixer does a lot of caching, so play and stop commands are executed dozens of times faster. Animation itself (clips just playing) is several times faster too.

[tschw]

@mrdoob Oh, BTW, I don't mind writing HTML docs, but IIRC you still wanted to change some stuff...

[mrdoob]

@tschw yeah, hopefully I'll implement animation support in ColladaLoader2 soon so I can understand how the animation system works.

[titansoftime]

Docs would be SUPER helpful, I've been stuck at 72 for quite some time now (granted I love 72, so no worries).

I have 74 kinda working but blending seems to be a little buggy in situations it didn't used to be before the new animation system. I could also be doing something wrong with this new api, without docs I'm not sure.

I know it's a long shot but it would be awesome if there were some more advanced examples, such as; multiple meshes, multiple meshes of both shared and non-shared geometries, multiple meshes shared/non-shared with out of sync animations (trees all waving in sync looks terribly synthetic) and of course examples of these using blending. I have most of these working, but I'm not sure if I am doing so in the most optimized manner. It feels like I am creating a lot of redundant animation/mixer/clip objects.

Could be a red herring but I noticed the "bugginess" I referred to while utilizing the oncomplete event. Example; On completion of an 'attack' animation the oncomplete event would then blend into the 'idle' animation. Previously I just modded the thee.js animation function to include a callback on 'stop', that worked perfectly for me.

So.. that's things from my perspective.

Got to say again, I love 72, I was able to convert all my objects into buffergeometry saving me TONS of memory. Awesome =]

[tschw]

@titansoftime

I know it's a long shot but it would be awesome if there were some more advanced examples, such as; multiple meshes, multiple meshes of both shared and non-shared geometries, multiple meshes shared/non-shared with out of sync animations (trees all waving in sync looks terribly synthetic) and of course examples of these using blending. I have most of these working, but I'm not sure if I am doing so in the most optimized manner. It feels like I am creating a lot of redundant animation/mixer/clip objects.

Example: webgl_shadowmap_performance (in-sync code path uses phases so it doesn't look terribly synthetic and, for performance testing, I also kept the full out-of-sync code path alive).

Could be a red herring but I noticed the "bugginess" I referred to while utilizing the oncomplete event. Example; On completion of an 'attack' animation the oncomplete event would then blend into the 'idle' animation. Previously I just modded the thee.js animation function to include a callback on 'stop', that worked perfectly for me.

There's a flag to control what happens on stop. Example: webgl_animation_skinning_morph (shows most API functionality)

I love 72

Me too - was my debut as a contributor.

[AndrewRayCode]

The JSON loader, when loading a rig from Blender, exports mesh.geometry.animations an an array of AnimationClips. These still aren't documented yet are coming out of the core of Three.js. Is this the right way to load rigged Blender animations? Or is there another way?

PS Could we require PRs to have docs before they're merged? This isn't the only instance of missing docs across multiple releases :(

[christimahu]

Docs would help for sure. Having a tough time figuring out how to play animations from a Collada that aren't from a skeletal system; that is, the animations aren't inline with the geometry structure, but instead in an array at the front of the object. It looks like I make an AnimationClip now, but the parse function doesn't match up to the object structure.

For example:

[titansoftime]

There's a flag to control what happens on stop. Example: webgl_animation_skinning_morph (shows most API functionality)

I'm sure I'm just blind but I do not see any type of complete event in the source of that example. Has this been altered?

[bakajin]

@tschw

I know I am supposed to ask this on stackoverflow, but :), Is there any form of onComplete event when a clipAction finished playing (or started for that matter) in the AnimationMixer or AnimationClip in the revised animation code of dev r81?

I've got all sorts of clips and mixers playing animation, all I need is for them to line up and we're flying.

Thanks for any pointers,

O

[titansoftime]

@bakajin

 mesh.mixer.addEventListener('finished',function(e){

       // some code

  });   

[bakajin]

@titansoftime thanks for the tip,

I got very excited reading your suggestions and thought why did I not think of that? However this code doesn't seem to work, sadly. I don't really see a mixer stored in mesh either.

I am however using dev branch r81 and simple SRT keyframe animation clips. Which seem to not live at the mesh/geometry level (like shape/morph keys and such).

I also tried adding the event listener to the mixer object and to the clipAction. Sadly also no cigar. Directly on the AnimationMixer in question, I get no errors but also no event is ever fired. If I trace the object, I see the listener sitting there.

On the AnimationClip in the mixer I always get errors that: addEventListener is not a function.

Back to the drawing board (though I do now cross check duration to current time, but that seems very inefficient)

Ta,

O

[titansoftime]

@bakajin I just tested in 82dev. The finished event works.

Refer to this fiddle: http://jsfiddle.net/titansoftime/v2682epf/

[bakajin]

@titansoftime,

Forget that. I tried adding the event to the mixer itself. And it works now!. Very nice, thanks for pointing me in the right direction. Also I don't get what I was wrong doing before.

but,

Heho

[gormat]

I want to start animation second time, but it does not start after one iteration.

animation.setLoop(THREE.LoopOnce, 0); animation.start(0);

it works well. but when I try to start it again, nothing happens.

I tried to reset animation when it is finished, but reset function triggers finished event as well. So when I run this code

mixer.addEventListener('finished', e => {
            console.log(e);
            e.action.time = 0;
        });

console.log loops.

How can I fix it ?

[mrdoob]

I think #10114 fixed this... https://github.com/mrdoob/three.js/pull/10064#discussion_r91639148

Do you mind trying with the dev version?

[gormat]

Thank you. I will continue using prod version. But when will these fixes merged ?

[mrdoob]

They were merged 2 days ago.

[gormat]

OK thank you.

[Mugen87]

The issue is now solved, see https://github.com/mrdoob/three.js/issues/10103#issuecomment-289234639