Javascript 使用mo js从中心设置SVG路径动画

我正在尝试使用mojs、

strokeDasharray

和

strokedashcoffset

为SVG的简单线型设置动画，可能我对这些属性和值感到困惑，它们在设置动画时表现得很奇怪

预期的行为是动画应该从中心开始，并且应该在一次拍摄中向两边生长，直到结束

但是，动画从线的中间开始，但以小片段进行统计，然后最终动画按预期进行-从中心开始增长，直到结束

我不明白为什么这些小片段会在一开始出现

单击页面以查看上面链接上的动画

---

如果我了解您在寻找什么，以下代码应该可以完成此工作：

const line = new mojs.Shape({
  stroke: 'blue',
  shape: 'line',
  strokeLinecap: 'round',
  radius: {'0': '50'},
  strokeWidth: 6,
  duration: 2000
})

---

strokeDasharray等属性的使用非常具有挑战性，特别是如果您正在寻找精确描述的动画。

一个问题。是否可以使用

strokedashcoffset

或

strokedashcoffset

？BCS我将在复杂的SVG路径中使用它。嗨，维马尔，你能发布一个复杂路径的示例吗？

const line = new mojs.Shape({
  stroke: 'blue',
  shape: 'line',
  strokeLinecap: 'round',
  radius: {'0': '50'},
  strokeWidth: 6,
  duration: 2000
})