SVG从值到值无限制地动画到原始值？

Question

是否可以在svg中使用<animate>标签将svg图像动画的一部分从一个值转换为另一个值。 或者甚至更好的动画从然后然后回到回到然后到; 等等？

我想为圆的半径设置动画，但是以无限的方式。 如果我不能用<animate>标签做到这一点，我还能怎么做呢？

到目前为止，动画一直运行到目前为止。

<svg>
    <circle r="100" cx="100" cy="100" fill="slategrey">
        <animate attributeName="r" from="0" to="100" dur="1.6s"/>
    </circle>
</svg>

Answer 1

而不是使用from和to ，使用values属性使其循环来回，而repeatCount属性使其永远重复。

<svg>
    <circle r="100" cx="100" cy="100" fill="slategrey">
        <animate attributeName="r" values="0;100;0" dur="1.6s" 
                 repeatCount="indefinite"/>
    </circle>
</svg>

在这里演示