Search the Community
Showing results for tags 'reordering svg elements'.
Found 1 result
Reording SVG Elements creates inconsistent animationUse case: As a user, I want to be able to modify the order of the SVG elements and be able to animate predictably afterwards. Codepen: http://codepen.io/anon/pen/pgYmzV Steps to reproduce: Hit the "Go Left" and "Go Right" buttons, this is correct baseline animation I want to preserve. Then if you restack the elements by hitting Order +, it will remove the element and reposition it above. When you hit "Go Left and "Go Right" again, the animation is slightly changed. Now if you hit "Order -" the element will reposition below. Hit "Go Left" and "Go Right" again, the animation is different. Repeating steps 2 through 5 will make the animation progressively worse. In the fixMatrix function, I log the transform element. As you can see, the xOrigin and yOrigin values change each time the stacking order is modified. At this stage, I don't know what to propose for a solution, so I am just opening the dialog about this issue.