AnimationEvent on skeletal animation

I would like to attach an AnimationEvent to a skeletal animation.
https://www.babylonjs-playground.com/#BHH4UG#2

Following this example from the documentation:
https://doc.babylonjs.com/babylon101/animations#attach-events-to-animations

From the API I understand skeleton has the property animations, but when I try to to print, it throws an error. AnimationEvent - Babylon.js Documentation

What am I doing wrong? :slight_smile:
Thanks in advance for any hint to solve the problem!

Animations in your case are not on the skeleton itself but on each individual bone:
https://www.babylonjs-playground.com/#BHH4UG#3

1 Like

Thanks for you help @Deltakosh
I hope, I’m not stupid again but I’m kinda expecting a console.log ā€˜Yeah’, which I don’t see. ˆˆ …

1 Like

No worries

What I was actually trying to say was:

I can’t see the console.log in your playground. So I assume that the event is not raised. Though, I think it’s not working yet :relaxed:

Or did I miss something? @Deltakosh

haha sorry :slight_smile:
You just need to start animations AFTER setting the events:
https://www.babylonjs-playground.com/#BHH4UG#4

3 Likes

Reading up on this thread. Also trying to attach an AnimationEvent to a frame number. For example: : At frame number 1.3, console.log(ā€œhello world.ā€).

Feel like I’ve been through every conceivable combination of object and array in the console, but no luck being able to attach an event to anything. Finally found an object that would accept addEvent without erroring out… but doesn’t seem to do anything. How the heck do you grab a handler to an animation group? Seems like it’s all there in inspector… but can’t figure out how to grab it.

https://www.babylonjs-playground.com/#55MFSX

Hey @bigrig, I adjusted your playground. I think it should work now:
https://www.babylonjs-playground.com/#55MFSX#1

I think, the problem was, that the animation duration was frame: 4.5 but your event was attached to frame: 10.

Not 100% sure – maybe the pro’s know more about that – But I think glTF and glb’s don’t work with frames anymore but with actual time. That’s why framesPerSecond is 1 in your file but your animation plays fluidly.

Ohmygosh. I was so focused on finding the path to animation that i didn’t notice that param! Thank you thank you!

Yes, strange about FPS. Also the structure of the exported GLB seems kind of a mess. There’s a couple replicated skeletons within armatures, all those keyframes, and an extraneous camera/light. I figure its related to my convoluted pipeline (FBX->Mixamo->GLB->Blender->GLB). But I’m not complaining, b/c with this frame event, everything in my game is now working! Awesome.

00%20AM

2 Likes

Hi Sir, I completely understand all the above answers. But I have a question here:
How can I attach an AnimationEvent to animation if the animation is LOOPING
I expect I can console.log message every time the animation arrives at that progress point when looping.

I expect it console.log(ā€œYeah!ā€) every at 10% progress when looping
Currently it just console.log once

Thanks in advance for any hint to solve the problem!

Thanks, Deltakosh! I keep on finding these bits of wisdom tucked away in old posts. :smile:. I was perplexed that I couldn’t get an event to trigger until I saw your post and placed the animation after the event-setting.

1 Like

It’s been a few months since you posted (so you probably resolved this already), but I thought I’d try to make Events repeat during the ā€œDude’sā€ looped walk cycle. It’s a pretty rough and messy attempt, so the Events go out of sync after a while–but they do repeat! The basic idea behind it is to use an event (event3, in this case) at the end of each walk cycle that restarts the animation. I used two versions of the same walk cycle and the switching of a number variable to try to alleviate the events-going-out-of-sync problem, but it didn’t work. Anyway, here’s a PG, for what it’s worth:

Repeated AnimationEvents during looped animation

Edit: the lights dimming and brightening (the events I used) went out of sync in exactly the same way no matter how I revised the code–and they repeatedly got back in sync again for a short while, which makes me wonder if the problem is due to lag caused by the light increasing in intensity? Maybe it’s slower than the dimming of the light? Not sure if that makes logical sense…

@carolhmj could you have a look at this one ?

1 Like

Hello! Instead of attaching the events to the bones, the way I would do it is by creating a ā€œdummyā€ animation to handle events, and adding everything to an AnimationGroup. This way, I wouldn’t have to worry about choosing a bone to add an animation to, or anything else, and it loops nicely this way: AnimationEvent and skeleton animation | Babylon.js Playground (babylonjs.com).