Only logo rotating

[Samy El Orfi]

Hi guys ! 

So, I'm new here, and I have a problem: I want to make the circle logo rotate but not the text in a svg file!  I'm using : 

<animateTransform 
       attributeName="transform"
       attributeType="XML"
       type="rotate"
       from="0 "
       to="360  "
       dur="5s"
       repeatCount="indefinite" /> 

But I don't know the center's coordinates  and when I choose : 22.5 22.5 (the width and height of the circle logo are 45px x 45px ) the circle changes its position or I want it to be in the right side of the text like in the file attached. 

You can check the codepen page !

Please can anyone help me?! 

Many thanks! 

See the Pen NWqMwdb by sampagani (@sampagani) on CodePen

[mikel]

Hey @Samy El Orfi,

 

Welcome to the GreenSock Forum

 

Your SVG is very complex.

The GSAP way to rotate an object very easy:

 

See the Pen poJVpoZ by mikeK (@mikeK) on CodePen

 

Happy tweening ...

Mikel

 

[Samy El Orfi]

Hi Mikel! 

Many thanks for your reply! Yes, I admit it, my svg is a complex! 

I think I must read some tutorials to use GASP  to implement your code! 

 

[ZachSaucier]

Hey Samy; welcome.

 

You should look into using SVGOMG for reducing the complexity of your SVG. Also, this thread may also help in preparing your SVG assets:

 

It's best not to mix SMIL and GSAP animations (or any other animations on the same elements) because they will conflict with each other.\

 

14 minutes ago, Samy El Orfi said:

I think I must read some tutorials to use GASP  to implement your code!

That sounds like a great idea! Here's a getting started article:

 

[Samy El Orfi]

Hi ZachSaucier!

Many thanks for your reply!! 
I'll start right now reading the tutorial! I hope I'll fix the logo soon!