Javascript SVG圆起点

如何更改svg圆的起点，以便从0点钟开始逐步设置其动画？默认的圆圈svg从3点钟开始

我的当前圆圈（悬停以显示动画）：

#时间线{
位置：固定；
宽度：500px；
高度：500px；
最高：50%；
左：50%；
利润上限：-250px；
左边距：-250px；
溢出：隐藏；
指针事件：全部；
z指数：99999；
}
#蓝圈{
笔划阵列：1510；
行程偏移量：1510；
-webkit过渡：所有1s轻松；
过渡：所有的1容易；
}
#蓝圈：悬停{
笔划偏移：0；
}

---

用变换旋转圆

#时间线{
位置：固定；
宽度：500px；
高度：500px；
最高：50%；
左：50%；
利润上限：-250px；
左边距：-250px；
溢出：隐藏；
指针事件：全部；
z指数：99999；
}
#蓝圈{
笔划阵列：1510；
行程偏移量：1510；
-webkit过渡：所有1s轻松；
过渡：所有的1容易；
}
#蓝圈：悬停{
笔划偏移：0；
}

你知道如何让动画在滚动中逐步播放吗？实际上我有4个部分，所以我只想在第2部分，蓝色的圆圈在25%，第3部分=50%，第4部分=75%。。。我使用了一个完整的js脚本，使每个部分都位于窗口的100%，因此主体处于溢出状态hidden@user2994359你能解释一下使用dashoffset背后的原因吗？确保你在iOS设备和桌面上进行测试。根据规范，有些设备在0300开始渲染圆，但有些（ios）设备在1200开始渲染圆。解决方案：在路径中使用两个半圆弧，而不是圆。