Animation 设置多段线动画'；使用SVG动画显示图形的外观

我正在使用HTML中的SVG使用折线工具定义特定的形状。我期待着动画的外观，一个特定的形状变成一个不同的形状在触摸按钮，并在几秒钟

我一直在考虑使用动画工具来更改“多段线点”属性，但到目前为止，还无法找到一个完美的解决方案或其他方法

有可能这样做吗？如果没有，是否有可行的替代方案？

您可以为tween提供多段线（甚至带有贝塞尔曲线的路径等），只要它们具有相同数量的点，因为SVG只是独立地移动每个（控制）点。如果形状没有相同数量的控制点，您可以重合一些，但我想图形编辑器会“纠正”这一点

签出此库：。它不能很好地加载SVG文件（有一个功能强大的插件），但它在动画方面非常出色；你能描述一下什么有效，你发现了什么问题吗？这可能有助于其他人在提出不够好的解决方案之前了解您的需求？我的意思是说如何在SVG自身的悬停上设置动画？

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="5cm" height="5cm"  viewBox="0 0 1000 1000"
  xmlns="http://www.w3.org/2000/svg" version="1.1">
<polyline stroke="red" stroke-width="3" fill="none">
  <animate attributeName="points" dur="5s" repeatCount="indefinite"
    from="100,100 900,100 900,900 100,900 100,100"
      to="200,200 800,500 800,500 200,800 200,200"
  />
</polyline>
</svg>