我正在编写 MuPDF 的 SVG 输出,并且遇到了 SVG 功能的限制。我想我会在这里问,以防这是已知解决方法的已知问题(或者万一我做了一些愚蠢的事情!)
我有以下 SVG:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="21.59cm" height="27.94cm" viewBox="0 0 600 600">
<path stroke-width="12" fill="none" stroke="#0000ff" d="M 150 300 L 80 300 L 80 370 L 150 370 " />
<clipPath id="cp0">
<path stroke-width="12" fill="none" stroke="#000000" d="M 150 300 L 80 300 L 80 370 L 150 370 " />
</clipPath>
<g clip-path="url(#cp0)">
<rect fill="#ff0000" x="0" y="0" width="600" height="600"/>
</g>
</svg>
这会绘制一条描边路径(形状像蓝色的“[”)。然后它将相同的路径设置为剪切路径,并将剪切路径填充为红色。
我希望将剪切路径设置为路径的描边版本,因此红色形状将完全覆盖蓝色形状。然而,在我的测试中,路径的“填充或描边”被忽略,并且路径被“填充” - 因此我在蓝色形状内绘制了一个红色正方形。
有没有办法获得我所希望的行为?或者我是否必须编写代码来手动展平和描边路径,然后再将其输出到 SVG?
预先感谢您的回复!
svg 中的剪辑路径只是形状,而不是形状的特征,因此换句话说,您不会包含笔划。您可以做的是使用蒙版,将蒙版中路径的描边设置为白色。
Here's 一个例子:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 600 600">
<defs>
<mask id="m0" maskUnits="userSpaceOnUse" x="0" y="0" width="600" height="600">
<path fill="none" stroke="white" stroke-width="5" d="M 150 300 L 80 300 L 80 370 L 150 370" />
</mask>
</defs>
<path stroke-width="12" fill="none" stroke="#0000ff" d="M 150 300 L 80 300 L 80 370 L 150 370 " />
<g mask="url(#m0)">
<rect fill="yellow" x="0" y="0" width="600" height="600" />
</g>
</svg>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)