Search the Community
Showing results for tags 'shapeindex'.
Found 3 results
-
MorphSVGPlugin morphs SVG paths by animating the data inside the "d" attribute. The video explains more (but uses the GSAP 2 formatting): It has never been easier to morph between SVG shapes. First, let's cover what this new plugin can do: Morph <path> data even if the number (and type) of points is completely different between the start and end shapes! Most other SVG shape morphing tools require that the number of points matches. Morph a <polyline> or <polygon> to a different set of points There's a utility function, MorphSVGPlugin.convertToPath(- 9 comments
-
- 1
-
-
- shape tweening
- svg shape
- (and 6 more)
-
Note: This page was created for GSAP version 2. We have since released GSAP 3 with many improvements. While it is backward compatible with most GSAP 2 features, some parts may need to be updated to work properly. Please see the GSAP 3 release notes for details. Since launching MorphSVGPlugin, we've made a bunch of improvements and exposed several new features. Here are the highlights... The challenge Before we dive into solutions, it helps to understand the tasks that MorphSVGPlugin must perform in order to work its magic: Convert the path data string into pure cubic B -
I have a little animation with the morphSVG plugin and would use the precompiled calculations for performance optimizing. So i use precompile: "log", but in the console is nothing to see. Same on shapeIndex: "log". I was wondering why - it seems correct to me.
