animation complete event

[jefffriesen]

I love the nice transitions, such as between a clustered bar chart and a stacked bar chart. I would like to do multi-stage transitions, such as resize after the first transition has completed. I couldn't find any events like onComplete or onAnimationComplete. in the documentation or source code. Is this an option?

I know that I can define the transition duration by: baseMarkProps: { transitionDuration: 1000 }, and then trigger a new animation after a timeout of that duration, but it's a little awkward.

Is there any events that trigger after the animation completes?

Thanks

[emeeks]

If you have a mark that is a path you can pass it a customTween property that will be passed customTween(previousMarkProps,currentMarkProps) that you could use to do any kind of tweening that you typically see with D3. But it's only honored with path elements. I use this to tween the arcs in pie and sunburst charts, so it's relatively undocumented. But if you have a nice clean idea for implementation I would be happy to explore it for Semiotic 2.

[jefffriesen]

I may not have made my question very clear. I'm not looking for finely tuned tweening control within a Semiotic component. I'm just looking for an event that gets fired when a transition, such as between a stacked and clustered bar chart is complete: https://recordit.co/kcGld955M8

I can then trigger other events or animations that may or may not have to do with that Semiotic component.

Thanks

[emeeks]

Unfortunately it's the individual marks themselves that animate and render, and I can't see a good way to tell you when they're done short of each of them emitting an event. I'm going to close this for now.