SVG变换圈成简单的线

Question

我正在尝试为一个简单的SVG圆圈（白色背景或任何其他颜色）制作动画，这样当你将鼠标悬停在它上面时，它就变成了一条简单的垂直线（换句话说，它有点变平成一条线）和鼠标好吧，那么它再次变成一个圆圈。

然而，我找不到很多关于如何处理它的信息......非常感谢任何和每一个帮助！

Answer 1

使用比例

的动画示例

<svg width="500" height="150">
    <circle cx="60" cy="60" r="40" style="stroke:#006600; fill:#00cc00" >
            <animateTransform 
            attributeName="transform"
            begin="0s"
            dur="2s"
            type="scale"
            from="1 1"
            to="1 0.01"
    repeatCount="indefinite"
        />
</circle>
</svg>