Share Posted May 22, 2017 Hello tweeners, drawSVG - circle I'm getting the reverse behaviour on IE in contrast to Chrome and FF. In my simple example Chrome and FF animate leaving a "u" shape, while in IE leaves a "n" shape. Any work-a-rounds? Regards Joostan See the Pen PmxVWp by Joostan-33 (@Joostan-33) on CodePen Link to comment Share on other sites More sharing options...
Share Posted May 22, 2017 Hi @Joostan IE and Edge are quite picky when it comes to drawing circles. One solution is adding an attribute for the stroke-dasharray. Another is converting the circle to a path before animation. (This is done with the MorphSVGPlugin.convertToPath() method). I actually started a thread on the topic of drawing circles last month and that lead to a lengthy discussion about it. We discussed various workarounds as well as converting it to path. I think there would be a lot of helpful information in there for you. Hopefully that helps. Happy tweening. 2 Link to comment Share on other sites More sharing options...
Author Share Posted May 22, 2017 Hello PointC, Your post does indeed unearth IE and other inconsistencies in the browsers using drawSVG: Animating SVG circle strokes from the 12 o'clock position with DrawSVG Thank you 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now