Search the Community
Showing results for tags 'morph svg'.
Found 4 results
-
Hello again guys ✌️ I´m right into the ‘basic‘ ScrollTrigger thing for quite a while now. Since I´ve upgraded myself with ShockinglyGreen, so things getting even greater with the MorphSVGPlugin, which progress of transformation can be controlled with ScrollTrigger. The Results are impressive. After playing around with this while interacting with svg elements directly in the DOM, I slightly get disturbed by the fps drops this can cause with other animations or if you get your page in bigger screen dimensions or resolutions (4K / Retina). I stumbled upon a great library called paper.js which can bring path information into canvas, which (in theory) should appear as the more performant approach, especially if you scale things up. Also the feature to group and edit things in paperscipt could be a good partner by creating for example a sweet set of dynamic fullscreen transitions without touching the DOM. The example below shows that it´s contents created with paper.js / paperscript can be changed by gsap and ScrollTrigger in a simple manner: demo It would be great to have a smart way to archive the MorphSVGPlugin behaviour inside this canvas stage which is controlled by ScrollTriggers progress. Maybe there is another general solution or it isn´t even really faster from an performance perspective than I expected. I´ll fork a simple demo to see morphSVG in action Seen on: Would love to read some thoughts from you about that Best Wishes, Richard
-
I'm trying to get the GSAP Morph SVG plugin to work. I use Animate to generate code. I'm including the plugin script file. I really can't wrap my head around how I'm supposed to set this up in Animate. I normally copy/paste existing working examples and then tweak code in my actions window. Where do I place the path files of the shape I'm morphing to?
-
I'm just trying to implement my own morph and I keep getting the same error: "invalid morphSVG tween value" Can someone tell me what I am missing or overlooking? This is someone else's code mostly but I'm trying morph for the first time.. just can't get it to work. Thanks!
