我正在研究SVG图像,我不知道如何删除路径的某个部分。
这是当前的情况:https://gyazo.com/DB59FCAF9F122E7E2C0BBA5833DB9EC5
有两个重叠的绿色字母和一个红色条,确实代表了我要擦除的区域,因此字母不会直接粘在彼此上。当我具有设定的背景颜色时,它可以正常工作,因为我可以轻松地覆盖较低的路径,但是在透明的背景下,此方法不再起作用,因为它似乎使路径透明,而不是整个像素本身。
tl; dr:如何使路径实际上呈现像素透明,而不仅仅是路径元素?
您可以用白色的矩形和额外的中风掩盖J。接下来,您再次使用N。请使用Mask <use>
svg{border:1px solid; width:90vh}
text{font-family:arial;dominant-baseline:middle}
<svg viewBox="0 0 24 24">
<defs>
<text id="n" x="7" y="14" >N</text>
<mask id="mascara">
<rect width="24" height="24" fill="white" />
<use xlink:href="#n" fill="black" stroke="black" />
</mask>
</defs>
<text x="5" y="10" style="mask: url(#mascara)">J</text>
<use xlink:href="#n" fill="black" />
</svg>