我终于知道了svg中stroke-dasharray和stroke-dashoffset如何计算了！！！ #

理解 #

1. 如果stroke-dashoffset为正数，则可以理解为将原线段从头裁剪了stroke-dashoffset的长度,可以理解为整体左移了stroke-dashoffset个单位。
2. 如果stroke-dashoffset为负数，最好理解的方法就是转换为正数，公式为Math.sum(...stroke-dasharray的值) - Math.abs(stroke-dashoffset的值)(参考下方7-9条例子);第二种我觉得难以理解：就是原线段整体右移了stroke-dashoffset个单位。（理解时记得线段左边补充好线条样式）。

实际规则 #

首先来一张文档里面的图，哈哈哈，是不是看了都头疼。

翻译一下：
1、定义一个变量pathlength为路径总长度
2、定义dashes为stroke-dasharray的值，转换为用户单位，必要时重复，使元素个数为偶数;如果属性值为none，则列表只有一个值0。
3、定义count为dashes的长度。
4、定义sum为dashes的总和
5、如果为sum为0，直接返回结果[[0, pathlength]]。
6、定义positions为一个空值，当做是个空数组吧。
7、定义offset为stroke-dashoffset的值。
8、如果offset为负数，设置offset为sum - abs(offset)
9、设置offset为offset % sum
10、定义index为sum(dashes[i], 0 ≤ i ≤ index) ≥ offset,可以理解为从索引0到i的和比offset大，则index就置为i。
11、定义dashlength为min(sum(dashes[i], 0 ≤ i ≤ index) − offset, pathlength),注意此处index为上一个定义的index,而不是数组长度；这里可以理解获取dashes中索引0到index的和减去offset与pathlength中的最小值。
12、如果index % 2 === 0,将[0, dashlength]加入到结果集positions中。
13、让position为dashlength
14、当position小与pathlength时，进行循环

1、设置`index`为`(index + 1) % count`
2、让`dashlength`为`Math.min(dashes[index], pathlength - position)`
3、如果`index % 2 === 0`,将`[position, position + dashlength]`加入到positions中。
4、设置`position`为`position + dashlength`

15、返回这个结果集positions;

w3c参考文档