将SVG中的剪裁区域展平为透明？

我有一个SVG文件：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="32px" height="32px" viewBox="0 0 32 32" enable-background="new 0 0 32 32" xml:space="preserve">
  <g id="main">
    <clipPath id="clip_mask">
      <path d="M20.9262,32C18.5189,30.6,16.9,27.9878,16.9,25c0,-4.4735,3.6265,-8.1,8.1,-8.1c2.9878,0,5.6,1.6189,7,4.0262V0L0,0l0,32H20.9262z" fill-rule="evenodd"/>
    </clipPath>
    <g id="icon" clip-path="url(#clip_mask)">
      <g id="transformed_icon" transform="translate(-1 -1)">
        <path d="M26.7,30.5H5.3c-0.4418,0,-0.8,-0.3582,-0.8,-0.8V2.3c0,-0.4418,0.3582,-0.8,0.8,-0.8h21.4c0.4418,0,0.8,0.3582,0.8,0.8v27.4C27.5,30.1418,27.1418,30.5,26.7,30.5z" fill="#FFFFFF" stroke="#6D6E71" stroke-width="1" stroke-miterlimit="1"/>
        <path d="M8.5,8.5h15M8.5,11.5h15M8.5,14.5h15M8.5,17.5h15M8.5,20.5h15M8.5,23.5h15" fill="none" stroke="#3E79B4" stroke-width="1" stroke-linecap="round" stroke-miterlimit="1"/>
      </g>
    </g>
    <g id="overlay">
      <path d="M25,18c-3.866,0,-7,3.134,-7,7c0,3.866,3.134,7,7,7s7,-3.134,7,-7C32,21.134,28.866,18,25,18zM26,29.8c0,0.1105,-0.0895,0.2,-0.2,0.2h-1.6c-0.1105,0,-0.2,-0.0895,-0.2,-0.2v-6.6c0,-0.1105,0.0895,-0.2,0.2,-0.2h1.6c0.1105,0,0.2,0.0895,0.2,0.2V29.8zM26,21.5c0,0.1105,-0.0895,0.2,-0.2,0.2h-1.6c-0.1105,0,-0.2,-0.0895,-0.2,-0.2v-1.3c0,-0.1105,0.0895,-0.2,0.2,-0.2h1.6c0.1105,0,0.2,0.0895,0.2,0.2V21.5z" fill-rule="evenodd" fill="#3E79B4"/>
      <path d="M26,20.2c0,-0.1105,-0.0895,-0.2,-0.2,-0.2h-1.6c-0.1105,0,-0.2,0.0895,-0.2,0.2v1.3c0,0.1105,0.0895,0.2,0.2,0.2h1.6c0.1105,0,0.2,-0.0895,0.2,-0.2V20.2z" fill="#FFFFFF"/>
      <path d="M26,23.2c0,-0.1105,-0.0895,-0.2,-0.2,-0.2h-1.6c-0.1105,0,-0.2,0.0895,-0.2,0.2v6.6c0,0.1105,0.0895,0.2,0.2,0.2h1.6c0.1105,0,0.2,-0.0895,0.2,-0.2V23.2z" fill="#FFFFFF"/>
    </g>
  </g>
</svg>

它是一个图标，右下角有一个覆盖层。主图标区域和覆盖区域之间存在剪辑间隙。此剪辑间隙在亲和力设计1.5.3.69:

中正确显示。

但不幸的是，许多其他程序无法识别剪辑间隙，因此无法显示它。例如，以下是LibreOffice Draw的屏幕截图：

---

那么，是否可以将SVG中的剪裁区域“展平”到与图标背景相同的背景透明度？这将使SVG剪辑间隙在此类不兼容的程序中可见且透明，并允许SVG中不支持剪辑区域的程序将剪辑区域渲染为透明。

是的，可以使用过滤器重复使用剪辑形状使剪辑区域透明。但是，我非常怀疑不能正确处理剪裁的渲染器是否能够处理过滤器。但你可以这样做：

矢量图设计软件中的SVG是在亲和设计中正确显示的，它是矢量图设计软件中的一个例子。然后重新导入亲和设计中的PDF，并将其导出为SVG。然后，我可以将SVG导入一个不支持剪辑的渲染器中，并且渲染得非常完美。这很有效。
谢谢你的想法！但问题不是什么可能导致不兼容的渲染器失败，而是SVG如何被展平。我将添加序言。谢谢你的想法！Chrome和亲和力设计器可以处理<代码>过滤器< /代码>标签。但不幸的是，我的应用程序（许可产品）不能。顺便说一句，为什么这么多SVG矢量图形都有内在的转换，比如
clipPath
等等？这矢量图设计软件SVG几乎是一种专有格式，而它应该是一个广泛认可的标准。我只是一个Web家伙-不能说其他渲染引擎：）我发现一个实用但繁琐和耗时的解决方案：因为SVG在矢量图设计软件中正确显示，所以我将亲和设计中的SVG打印到PDF打印机驱动程序。然后重新导入亲和设计中的PDF，并将其导出为SVG。然后，我可以将SVG导入一个不支持剪辑的渲染器中，并且渲染得非常完美。它起作用了。