SVG无法正常工作

我希望深蓝色的点以相同的速度运行，持续时间相同，但仍然有一个点有点晚，我还希望在徽标的圆圈之后，所有的点将合并为一个大点，然后移动到笔记本电脑图标

这是我试过的。。 好心帮忙

下面是片段

.st0{填充：无；笔划：#303D4F；笔划斜接限制：10；}
.st1{fill:#21A8E0；}
.st2{fill:#FFFFFF；}
.st3{字体系列：'Lato-Light'；}
.st4{字体大小：16px；}
.st5{fill:#303D4F；stroke:#303D4F；stroke miter:10；}
.st6{fill:#6EC5E0；}
.st7{fill:#DDE9F1；}
.st8{填充：无；笔划：#303D4F；笔划宽度：2；笔划线帽：圆形；笔划线连接：圆形；笔划斜接限制：10；}
.st9{填充：#FFFFFF；笔划：#303D4F；笔划宽度：2；笔划线条帽：圆形；笔划线条连接：圆形；笔划斜接限制：10；}
.st10{填充：#FAFBFC；笔划：#303D4F；笔划宽度：2；笔划线帽：圆形；笔划线连接：圆形；笔划斜接限制：10；}
.st11{fill:#303D4F；}
路径{
行程数组：1093.921093.92；
笔划偏移：0；
过渡时间函数：线性；
过渡时间：2.5s；
过渡延迟：0.5s；
动画持续时间：2.5s；
}
贸易
衍生工具
宏观经济学
供应与需求
金融市场
地缘政治

第一部分，@MaxStarkenburg是完全正确的，上面的路径与其他路径没有相同的长度，因此他的小点不需要相同的时间完成整个旅程

对于第二部分，我将在第一个动画使用完

animationID.end

值后开始一个新的动画

下面是它的样子：

路径{
行程数组：1093.921093.92；
笔划偏移：0；
过渡时间函数：线性；
过渡时间：2.5s；
过渡延迟：0.5s；
动画持续时间：2.5s；
}
贸易
衍生工具
宏观经济学
供应与需求
金融市场
地缘政治

我的道歉。我发布的答案（将

h204.6

添加到

path-to-trace-3

的

d

属性）没有解决您的第二个问题，因为在我最初工作的Firefox中，这似乎不是问题。我将删除该答案，以免其他人认为这已完全解决。哇……我的第一个问题是由于你而解决的，但我不希望徽标圆圈移动，我希望在传递到徽标后将所有圆点作为一个圆点移动到笔记本电脑上。。你明白我的意思吗？好的，但正如你建议添加另一个动画，我会尝试，但如何将所有小点组合为一个呢？好吧，创建一个新的圆圈第二个动画可能只是一个点，从大圈后面移动到笔记本电脑（而其他点只是隐藏在大圈后面），不是吗？（凯伊多在我做之前一分钟所说的：-）这正是我想说的@MaxStarkenburg也在上面的代码片段中，我把那个圆圈放在了代码中，那个圆圈不起作用，因为在标志圆圈和笔记本电脑之间的那条线不是一个而是一个行标记。我对SVG非常陌生，所以我尝试了Kaido如何用logo圆圈演示。但这对我不起作用，我不知道该怎么做left@srijanair，在我给你的代码片段中，我创建了一个路径

#last path

，可供

使用。您只需创建一个新的圆圈，大小如您所需，将其放置在徽标后面，然后移动