Jump to content
GreenSock

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

Odd result with DrawSVG

Recommended Posts

I just want to animate this svg left to right, however, no transition is happening. Not sure why.

 

The SVG is just exported from Illustrator.

 

Thanks in advance.

See the Pen obrQOZ by jroncero (@jroncero) on CodePen

Link to comment
Share on other sites

Hi jroncero,

 

I had a look at your CodePen but, could you be a bit more specific as to what is not happening? I mean, am not sure what is the SVG you are referring to.

 

Are you talking about the DrawSVG plugin? Is that line of yours originally a dashed line? If that is the case, and that is what you are trying to Tween, PointC has an explanation on how you can achieve that. Here is the

See the Pen zrQLvO by PointC (@PointC) on CodePen

.

 

Hope this helps.

  • Like 1
Link to comment
Share on other sites

Yeah - putting the ID on the SVG or group rather than the path can trip you up.

 

I did that quite a few times when I first started using the DrawSVG plugin. I still accidentally do it once in awhile, but now it's an easy fix.  :)

  • Like 1
Link to comment
Share on other sites

It seems you just had the id of #up on the svg instead of the polyline. see fixed and reduced version here: http://codepen.io/GreenSock/collab/MKMLVr/

This works, thanks.

 

I noticed however, that you edited the SVG itself to have the polyline property, which was not present in Illustrator export file. Did you use a specific tool to update the SVG?

Link to comment
Share on other sites

I ran the SVG through SVGOMG at one point to see if it would fix any errors  https://jakearchibald.github.io/svgomg/ 

I wasn't aware that it changed something to a polyline. Are you saying your original did not have a <polyline> element at all?

Link to comment
Share on other sites

I ran the SVG through SVGOMG at one point to see if it would fix any errors  https://jakearchibald.github.io/svgomg/ 

I wasn't aware that it changed something to a polyline. Are you saying your original did not have a <polyline> element at all?

Sorry, it did have a polyline element, disregard that comment

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.
×