[How to animate arc along svg circle path smoothly?]

Thank you! Using pathLength s a nice trick, simple but looks nice!

[How to animate arc along svg circle path smoothly?]

Yes, I am trying to make the grey arc act the same as the red one!

 

Your solution does help! Thank you!

 

But now the grey arc is a little away from the circle path,

Is it possible to make the grey arc exactly move along the path of circle (cover on it)?

Thanks again!

[How to animate arc along svg circle path smoothly?]

I have learned from the doc that how can I animate rect along path. For advance, how can I make the arc-shaped element（id="pin-arc" in the codepen demo） move around the circle path, and always fits to the circle radian？
Is this possible with only MotionPathPlugin?

Or are there any other solution for this, (yet prefer not to includes other plugins).

Thank ahead!

See the Pen dyaKJPE by cc5324 (@cc5324) on CodePen