获取SVG路径部分（或拆分路径）

Question

输入：

• SVG路径，可能包含线条和曲线。
• 此路径的百分比长度（比如路径的50％）

输出：

• svg路径，该路径是从开始到给定点的的路径的一部分。

在path getPointAtLength以及getPathSegAtLength上有一个很好的方法，所以我们可以按照给定的长度获得细分，但仍然不清楚如何＆＃34;拆分＆＃34 ;这段和所需的路径。

我想知道这个问题有一些统一的解决方案。

Answer 1

正如您所发现的，SVGPathElement具有逐步遍历路径段的方法。您只需要逐步完成它们，直到找到必须细分的那个。请注意，这些API正处于变化之中。因此，您可能需要在某些浏览器中使用polyfill - 具体取决于您是选择使用新API还是旧API

唯一难以细分的路径段类型是二次和三次贝塞尔曲线。但使用De Casteljau的算法，这些实际上也很简单。

请参阅：Divide bezier curve into two equal halves

该答案解释了划分立方贝塞尔曲线。然而，二次版本非常相似。