animated svg-s

Show off your finished Inkscape work.
Lazur
Posts: 4418
Joined: Tue Jun 14, 2016 10:38 am

animated svg-s

Postby Lazur » Sun Dec 03, 2017 11:15 am

A javascript animation I finished recently:

SVG Image


Idea and base animated svg came both from openclipart.
Jarda made this one of a single cube, where each slice was a separate clone of a path in the defs section -moved the parents to a new layer and made them into groups instead for the custom colours.
Also, the original used one animation definiton for both rotating in a full circle -switched that to one spinning and another going back and forth between 15° and -15°.

Quite complicated approach with all the "unnecessary" groupings.
Next step would be using diagonal slicing for a more consistent look. This one uses 3 parent objects so there are plenty of space for fine-tuning the process...

Anyway, I'm satisfied that this one works as I'm totally unfamiliar with javascript animation in general.

Lazur
Posts: 4418
Joined: Tue Jun 14, 2016 10:38 am

Re: animated svg-s

Postby Lazur » Sun Dec 03, 2017 3:53 pm

Animated kaleidosacope:

SVG Image

Lazur
Posts: 4418
Joined: Tue Jun 14, 2016 10:38 am

Re: animated svg-s

Postby Lazur » Sun Dec 03, 2017 4:35 pm

Gets a bit laggy at full size, but renders fine when zoomed out a bit:

SVG Image

Lazur
Posts: 4418
Joined: Tue Jun 14, 2016 10:38 am

Re: animated svg-s

Postby Lazur » Mon Dec 04, 2017 12:44 am

Notes so far: chrome renders the rotation right, whereas firefox is off-center.

These are scaled down, therefore should render much better:





SVG Image


SVG Image

tylerdurden
Posts: 1817
Joined: Sun Apr 14, 2013 12:04 pm
Location: Michigan, USA

Re: animated svg-s

Postby tylerdurden » Mon Dec 04, 2017 2:08 am

Fantastic! :mrgreen:
Have a nice day.

I'm using Inkscape 0.92.2 (5c3e80d, 2017-08-06), 64 bit win8.1

The Inkscape manual has lots of helpful info! http://tavmjong.free.fr/INKSCAPE/MANUAL/html/

Lazur
Posts: 4418
Joined: Tue Jun 14, 2016 10:38 am

Re: animated svg-s

Postby Lazur » Mon Dec 04, 2017 6:01 am

Thank you!


Return to “Finished Inkscape Work”

Who is online

Users browsing this forum: No registered users and 1 guest