Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
bullybear

Can't see MorphSVGPlugin SVG

Recommended Posts

I built an animated svg using the morphsvgplugin (I pay x dollars a month to have access to this package).

 

The attached html file should look like the accompanying codepen . However, when I run it locally, nothing populates.

 

The code in the attached html example is slightly different than the codepen (which works fine) - Essentially the cdn script libraries in the html file are more recent, and I replaced MorphSVGPlugin.pathDataToBezier with MotionPathPlugin.getRawPath

 

Any help would be immensely appreciated. 

greensockexample.html

See the Pen qBmgVoP by bullybear (@bullybear) on CodePen

Edited by bullybear
Made more specific & clear.
Link to comment
Share on other sites

Welcome to forums @bullybear

 

You're going to have be more specific than it's not working. Do you see any errors in the console? That CodePen is using a very old version of GSAP, so I wouldn't expect it to work, especially with the MorphSVGPlugin as it's calling pathDataToBezier, which doesn't exists anymore. 

 

 

I would suggest going through our Mirgration Guide, and updating everything to latest syntax before continuing.

 

 

 

 

Link to comment
Share on other sites

Thanks for being a Club GreenSock member, @bullybear🙌

 

Are you just asking how to migrate that old code to the more modern GSAP 3 syntax? 

Link to comment
Share on other sites

@GreenSock

 

Yes I am. I have refined my post from earlier so it is easier to follow. Any help would be immensely appreciated. 

Link to comment
Share on other sites

@OSUblake

 

I tried making me question more specific. Please let me know if this helps (and no - no errors in the console).

 

I really appreciate it. 

 

 

Link to comment
Share on other sites

You can get rid of this as you're already loading gsap.

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.1/TweenMax.min.js"></script>

Did you register the plugin?

gsap.registerPlugin(MotionPathPlugin, MorphSVGPlugin);

 

  • Like 2
Link to comment
Share on other sites

@PointC

 

Thanks for responding. No I did not! When I added that line into my js code I still didn't see anything though .. 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×