alexk111 / SVG-Morpheus

JavaScript library enabling SVG icons to morph from one to the other. It implements Material Design's Delightful Details transitions. (THIS PROJECT IS NOT MAINTAINED ANYMORE)
MIT License
2.7k stars 241 forks source link

Path getting modified at start / end of animation #8

Open urmilparikh opened 9 years ago

urmilparikh commented 9 years ago

Notice the home icon after animation start / before animation end: http://plnkr.co/edit/AR1VQJ2KbmrCXXHWDwdC?p=preview

urmilparikh commented 9 years ago

@uddipan, Is this effect of what you said in your comment?

Emasoft commented 9 years ago

It is better to disable rotation for testing. The morphing is still intersecting the vertices with the segments. This should never happen. Can you fix this with your algorithm?

dalisoft commented 8 years ago

Hi @urmilparikh and @Emasoft Try some suggestion, maybe helps:

  1. Convert your relative bezier values to Absolute.
  2. Use 'M, L, C, A' more as possible insteadof other h, v like values.
  3. You can checkout my javascript for paths Unim.js Animation Engine.

Remember, SVG-Morpheus doesn't edit current path, it maked another tag. Maybe i wrong, correct if i'm wrong. Thanks