小编Kal*_*ann的帖子

我正在尝试动画扩展线.我已经在css中使用它,但我需要在javaScript中完成它,因为这是我可以获得路径长度的唯一方法,这是我需要的.我想我很亲密,但它不起作用!有任何想法吗？

以下是我的代码.如你所见,我得到了路径的长度,并给它一个这个长度的strokeDashArray.这意味着该线将是虚线,但是破折号正在填满整条线.诀窍是减少strokeDashoffset值,因为它决定了破折号的起始位置.因此,如果它也从pathLength开始,则该行将完全不可见,并且减小该值将显示该路径.

我知道这是可能的btw :)如上所述,我已经在css中工作了.

var element = document.getElementById("animpath");
var pathLength = element.getTotalLength();

element.style.strokeDasharray = pathLength;
element.style.strokeDashoffset = pathLength;

function animateRoute (e) 
{
e.style.strokeDashoffset = e.style.strokeDashoffset - 100;
}

for (i = 0; i < 100; i++)
{
animateRoute(element);
}

提前致谢!