How do you pause a running SVG animation using <animateTransform> element inside an SVG without losing the animation state?
Setting animation-play-state: paused; on either the animating element, or the parent element has no effect. Changing the repeatCount from indefinite to 0, loses the animation state.
Kinda late, but here is how to do it in vanilla javascript: https://codepen.io/jjdewitt/pen/XJRqNK?editors=1010
You need to call
yourSvgElement.pauseAnimations();on the SVG Element