SVG路径上的布尔运算

Question

截至2014年初，SVG规范没有对布尔运算的任何内置支持

布尔运算是用于改变大多数重叠路径的固有几何的方法。它们允许通过对更简单的形状执行操作来构造复杂的形状，并且在某种程度上类似于Constructive Solid Geometry(CSG)。

然而，这个问题涉及2D矢量路径。 流行的路径操作是：Union，Substraction，Intersection，XOR（Exclusive Or）。

是否有任何图书馆可以帮助我解决这个问题？

Answer 1

有Javascript Clipper，它允许路径上的所有Boolean Operations组，但条件是输入路径是多边形。

• 如果我们有任何曲线（立方/二次贝塞尔曲线），可以使用De Casteljau algorithm轻松地将它们细分为多边形。

  • 如果细分样本足够高，则结果将是视觉上看起来像曲线的多边形（以大量数据为代价，因为顶点数量线性增加，具体取决于细分的保真度）。

然后我们可以在JavaScript Clipper中为布尔操作提供路径。

---

这里需要注意的是，如果它包含曲线，我们将失去路径固有的“弯曲”性质。上面提到的“多边形化”或多或少是一条单行道。