传输原点似乎在 SVG 中不适用于野生动物园中的缩放或缩放问题

Question

我正在尝试在无限动画中将部分填充的圆旋转到其他圆的顶部，但是在放大和缩小时，它没有将外部蓝色填充圆与内圆正确对齐transform-box: fill-box。

用于旋转的 CSS

    @keyframes rotation {
        from {
            transform: rotate(0deg);
        }
        to {
           transform: rotate(360deg);
        }
    }
.cls-5 {
       transform-origin: center center;
       //transform-box:fill-box;
        animation: rotation 1.5s infinite linear;
    }

JSBin 演示链接

野生动物园的图像错误

野生动物园的正确图像

Answer 1

这是 Safari SVG 变换原点缩放动画的可能副本