vivus icon indicating copy to clipboard operation
vivus copied to clipboard

Callback function for when a path is completed?

Open jmckalex opened this issue 2 years ago • 1 comments

Thanks so much for making this code available.

Is there a way to arrange to have a callback function called when a path is completed? I am using vivus with reveal.js (https://revealjs.com) and I would like to be able to have parts of a SVG "drawn in" using the OneByOne animation type as part of a reveal fragment. That requires being able to call stop() at the right time, so that only the desired paths are drawn, with the rest remaining hidden until the next fragment is shown.

What I have in mind is the ability to register a callback function like

   path_completed( path ) { ..... }

where 'path' is the DOM element of the path which just finished drawing in its entirety. By registering such a callback function, it would be easy to check if certain paths had finished drawing and, if so, call stop() to pause the drawing. Or do other things, like change the class so as to allow a CSS animation to fade-in the fill of a closed path which was just drawn (like the hack you give).

jmckalex avatar Jan 29 '23 22:01 jmckalex

Hello! Hello!

Thanks for your kind words :) About your request, nothing out of the box will let you do that. However, I provided a trick in the issue #241 that should help you. This will require to edit your SVG and group your paths.

maxwellito avatar Jan 30 '23 22:01 maxwellito