如何实现多个交集和并集剪辑

Anu*_*sha 5 union svg intersection clip

我正在开发一个用于特定目的的 SVG 转换器。SVG版本是1.1,有点旧,但我必须使用这个版本。

我很难尝试实现剪辑列表。

剪辑结构如下。

struct
{
    edgeList *path
    clip *intersect
    clip *union    
} clip
Run Code Online (Sandbox Code Playgroud)

任何剪辑对象都可以有相交剪辑或并集剪辑,或两者都没有(但不能同时具有两者)。因此,如果存在相交的剪辑,我必须使用该剪辑路径与父级相交。如果有联合剪辑,我必须将其与父级合并。

根据SVG规范,我可以通过定义两个clipPath元素并在另一个clipPath的clip-path属性中使用其中一个来使用两个剪辑的交集。可以实现联合,以便您在 ClipPath 元素内部定义两个路径。

现在,如果我得到多个剪辑路径怎么办?举例来说,其中 5 个,

  1. 前两个剪辑应彼此相交
  2. 第三个剪辑应与之前的结果结合起来
  3. 第 4 个剪辑应与前一个结果相交
  4. 第 5 个剪辑应与之前的结果结合起来

注意:合并后的黑色区域是最终的剪辑区域。

剪辑示例

我可以尝试这样实现。

<defs>
<clipPath id=cp1>
    <path>red</path>
<clipPath>
<clipPath id=cp2 clip-path="#cp3">
    <path clip-path="#cp1">green</path>
    <path>purple</path>    
<clipPath>
<clipPath id=cp3>
    <path>yellow</path>
<clipPath>
</defs>
Run Code Online (Sandbox Code Playgroud)

我被困在第五个剪辑了。

我该如何结合这个?此外,这种方法更难以编程方式实现。这个有更好的办法吗?如果没有其他办法,我想我将不得不将其作为 SVG 的限制而推迟。