Share Posted February 25, 2019 Hi there, i would like to have some reliable, understandable svg-nesting method, ready for dynamic x/y-shift and rotation. I am trying to get some results, still without centerpoint manipulation (brain not ready yet, sorry). I found out that its possible to shift groups very well with <svg> parents, and to rotate groups better with <g>parents. If you play with the example, please try to start over and change order of manipulation. You will see, that centerpoint gets fixed at the moment of first-time object-rotation. Since it deals with nested svgs, i hope my explanation sounds not too complicated. See the Pen qvWGYQ by Frnzmtz (@Frnzmtz) on CodePen Link to comment Share on other sites More sharing options...
Share Posted February 25, 2019 Sorry, but I don't understand what you are asking. Thanks for the demo, but I don't understand what to do with it. What is rechteck3a? Am I supposed to look in the SVG code and try to decipher the rgb value? fill="rgba(250,250,50,0.70) Perhaps you can try to explain 1 simple interaction, the result it gives and the desired result you would like. I'm guessing your issue has more to do with how SVGs handle transform origin and nested elements and not necessarily something related to gsap. I think that GSAP's smoothOrigin may help you. Please read section challenge: set transformOrigin without unsightly jumps at: https://greensock.com/svg-tips 4 Link to comment Share on other sites More sharing options...
Author Share Posted February 25, 2019 Codepen html is a bit unorganized, sorry. I did a lot of flash, still thinking in nested timelines, and want to reproduce this structure with GSAP. My main point is, that it was told impossible to have nested svgs with different rotation on elements/group but I found out that it is possible. "However - If you end up nesting an SVG inside another one you will not be able to transform the nested root SVG element (for now)." from here: 12th post from top 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