[FEATURE REQUEST] Support for Declarative (SMIL) Animation

Question

[FEATURE REQUEST] Support for Declarative (SMIL) Animation

christianhujer opened this issue 4 years ago · comments

When recording a declarative (SMIL) animation, the animation speed in the recorded video does not match the animation speed in the actual SVG file.

Steve Tung · Answer 1 · Sat Oct 03 2020 00:08:16 GMT+0800 (China Standard Time)

Hi @christianhujer, unfortunately due to its implementation, timecut/timesnap does not support SVG animations-- it only aims to support JavaScript and (some) video.

Christian Hujer · Answer 2 · Sat Oct 03 2020 00:14:42 GMT+0800 (China Standard Time)

I guessed so. Maybe we can keep this ticket open as a feature request? I understand that upstream changes may be required, even as far as to Chromium itself.

Steve Tung · Answer 3 · Sat Oct 03 2020 01:25:12 GMT+0800 (China Standard Time)

This project primarily uses only JavaScript and Puppeteer for time handling, so changes to Chromium would probably be outside of the scope.

That said, it's not completely out of the question to make a JavaScript implementation of SMIL. In fact, a quick search shows that there's a JavaScript polyfill for SMIL at https://github.com/ericwilligers/svg-animation, which might work for you (though it might require some work to force an overwrite with browsers that already support it and disabling native SMIL support).

See Also:
https://bugs.chromium.org/p/chromium/issues/detail?id=498081 (maybe using --disable-blink-feature=smil to disable native SMIL handling)

Alexander Batischev · Answer 4 · Wed Jul 14 2021 19:19:37 GMT+0800 (China Standard Time)

I'm not a web developer, so I might be entirely wrong here, but it appears that SVGs have a couple methods that can help:

pauseAnimations() can stop the animation;
setCurrentTime() can move the animation to the desired point in time, in seconds.

Can't they be used to pause the animation and then advance it along with the "virtual time" in which all other elements live?

Steve Tung · Answer 5 · Wed Jul 14 2021 22:23:44 GMT+0800 (China Standard Time)

Thanks @Minoru for the information; I wasn't aware of these methods. This does make SVG Animations look a lot more promising. I'll take a look into this when I have some time.