Search the Community
Showing results for tags 'svg pie chart rotation'.
Found 1 result
-
Hi everyone, I'm facing an issue while trying to have a particular SVG group rotating around itself. The particular SVG group contains a pie chart composed of 4 or 5 arcs, built with Path elements. It is working fine when I have 4 path elements, rotating as expected around its center. It gets complicated when I have 5 elements. In this last case, the center of rotation seems to move in circle as the wheel rotates... I tried with 1, 2, 3, 4, 6, 7+ elements, all working fine, but not with 5. Because I need to just have the SVG group rotating, I can't just make the whole SVG element rotating around itself. Which is sad because I'm not meeting this issue when the whole SVG is rotating. You'll see in the pen (https://codepen.io/CapPat/pen/xdVBrr?editors=1010) 3 pie charts : the blue one has 5 elements, rotating fine because the whole SVG is rotating (which I don't want) the pink one has 5 elements with only the svg group rotating. This one has the weird behavior with the rotation the green one has 4 elements with only the svg group rotating. This one is rotating as expected. I need your help for finding why the pink one has its rotation center moving in circle, while the green one is rotating fine... Also, congratulation to the GSAP team for their amazing work! Thank you ! (note: I may put things I don't want to see rotating at the center of the pie, this is why I don't want to rotate the whole SVG element)
