svg的路径运动动画animateMotion，在IE11不兼容怎么办？

Question

有个svg画板，如图：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="400" width="450">
  <defs>
    <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" style="stop-color:#a1c4fd;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#a1c4fd;stop-opacity:0" />
    </linearGradient>
  </defs>
  
  <text font-size="14" x="0" y="0" fill="#cd0000">@
    <animateMotion path="M 100 350 q 150 -300 300 0" begin="0s" dur="3s" rotate="auto" repeatCount="indefinite"/>
  </text>
  <path d="M 100 350 q 150 -300 300 0" stroke="url(#grad1)" stroke-width="5" fill="none" />
</svg>

我希望给曲线加上一个粒子动画的特效,有个粒子（长条，有尾巴）从左端开始沿着轨迹运动到右端结束。暂时我们先用文本来替代显示。

试过offset-path和animateMotion，效果不错，但是IE11不兼容。何解？

Answer 1

不兼容，没有替代方案。只能放弃svg，采用echarts的飞线效果