SVG路径上的布尔运算

Nik*_*des 13 javascript svg computational-geometry

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

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

然而,这个问题涉及2D矢量路径.流行的路径操作是:Union,Substraction,Intersection,XOR(Exclusive Or).

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

Nik*_*des 8

Javascript Clipper,它允许路径上的所有布尔运算集,但条件是输入路径是多边形.

  • 如果我们有任何曲线(立方/二次贝塞尔曲线),可以使用De Casteljau算法轻松地将它们细分为多边形.

    • 如果细分样品是足够高时,结果将是,在视觉上看起来像一个曲线(在大量数据的成本作为顶点的数量而线性增加,这取决于细分的保真度)的多边形.

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


这里需要注意的是,如果它包含曲线,我们将失去路径固有的"弯曲"性质.进行上述"多边形化"或多或少是单行道.