荧光笔不透明效果 pdftron 到 SVG

Question

我尝试使用 PDFTron 将注释转换为 SVG；我按照此链接中的示例进行操作 PDFTron。将注释转换为 svg 一切都很完美，正如预期的那样，少了一件事。荧光笔。它将荧光笔提取为具有高库存宽度的线是有意义的。但不透明效果并不是导出的一部分。查看提取的 SVG 样式。我很感激任何与此相关的建议。

<style type="text/css">
<![CDATA[
.ps00 { stroke:#3B95D4;fill-opacity:0.098039;stroke-opacity:0.19608;fill:#3B95D4;fill-rule:evenodd; }
.ps01 { stroke:#FFFF00;fill:none; }
.ps10 { stroke-width:0.25;stroke-linejoin:round; }
.ps11 { stroke-width:12;stroke-linecap:round;stroke-linejoin:round; }
]]>
</style>

SVG 线条路径

<g id="q4" class="">
            <g id="q5" class="">
                <g id="xfrm6" transform="matrix(1 0 0 1 182.684 310.918)">
                    <clipPath id="clp3" clip-rule="nonzero">
                        <rect x="182.7" y="310.9" width="108.3" height="30.47"/>
                    </clipPath>
                    <g id="frm7" transform="matrix(1 0 0 1 -182.6842 -310.9183)" clip-path="url(#clp3)">
                        <clipPath id="clp4" clip-rule="nonzero">
                            <rect x="182.7" y="310.9" width="108.3" height="30.47"/>
                        </clipPath>
                        <g id="frm8" clip-path="url(#clp4)">
                            <path d="M195.18 323.5 C196.26 323.59 196.51 323.74 197.4 324.05 C198.36 324.38 199.3 324.92 200.21 325.17 C201.9 325.61 203.49 326.11 205.23 326.28 C206.33 326.4 207.11 326.7 207.47 326.83 C208.31 327.14 207.99 327.2 209.14 327.4 C217.56 328.89 228.64 327.59 237.06 326.83 C238.67 326.69 240.02 326.47 241.54 326.28 C241.91 326.28 242.28 326.28 242.66 326.28 C239.68 326.28 237.8 326.28 234.83 326.28 C227.15 326.28 211.74 323.44 205.78 327.4 C208.84 327.4 211.67 327.89 214.73 327.95 C235.94 328.35 257.18 327.95 278.39 327.95 C276.85 327.69 276.51 327.34 275.04 326.83 C273.3 326.24 271.22 325.93 269.46 325.71 C268.08 325.54 269.17 325.71 267.78 325.71 C266.28 325.71 265.92 325.71 264.42 325.71 C258.6 325.71 252.94 324.68 247.11 324.6 C238.92 324.48 230.73 324.6 222.54 324.6 C231.67 324.6 240.79 324.6 249.92 324.6 C251.94 324.6 251.62 324.87 249.92 324.6 C247.89 324.27 245.81 324.36 243.78 324.05 C242.22 323.81 240.92 323.6 239.3 323.5 C238 323.42 239.67 323.5 240.97 323.5" class="ps01 ps11"/>
                        </g>
                    </g>
                </g>
            </g>
        </g>

以及PDF 中的 片段

Answer 1

由于 SVG 输出是 XML，因此您可以使用任何 XML 工具将 CSS 添加到 SVG 输出中的 g 组之一。

style="mix-blend-mode:multiply"

例如在您的 q4 id 上。

这应该可以在您想要支持的浏览器中运行良好。
https://caniuse.com/?search=mix-blend-mode