svg - 沿 svg 路径以特定百分比放置对象？

Question

目前我正在使用该<animateMotion>元素非常快速地将对象（由路径定义）设置为正确的结束位置。这在 Chrome 中显示正常，我没有努力让它与 Batik 一起使用。

但我很好奇：没有动画有没有更好的方法来做到这一点？只是沿着 a 的长度绘制它（比如 80%）<path>？

Answer 1

如果您正在创建静态 svg 图像，那么您应该提前知道放置对象的确切位置。例如，您可以使用transform属性将对象放置在您想要的位置。

如果您在事先不知道要放置对象的位置的情况下这样做，那么您可以使用 javascript，getPointAtLength方法将为您在给定长度偏移处的路径上提供一个点。您可以通过调用getTotalLength来查询计算的路径总长度。