SVG描边动画原理

SVG描边动画原理其实很简单，主要利用如下两个属性

stroke-dasharray 制做虚线，使得黑白相间，

stroke-dashoffset 使得虚线向开头偏移，这里的1500不精确，是我随便取的，下文介绍经过JS获取长度。

动画就是减小虚线偏移，那么实线就会慢慢漏出来了

 

JS获取长度

　　var path = document.querySelector('path');

　　var length = path.getTotalLength();

　　而后改变path.style.strokeDasharray 和 path.style.strokeDashoffset为获取的长度便可。