我正在尝试弄清楚如何正确地编辑SVG文件。我有以下代码:
<svg width="80" height="50" viewBox="0 0 80 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="80" height="50" rx="4" fill="#497284" fill-opacity="0.09"/>
<path d="M70 11.8092V11.5C70 8.42972 68.2774 6 64.6107 6C60.8949 6 59 8.38554 59 11.5663C59 14.6145 61.1409 17 64.66 17C66.8993 17 68.9172 15.9618 70 14.1727L68.1298 13.2229C67.2931 14.4598 66.3826 15.2329 64.6846 15.2329C62.5682 15.2329 61.2394 13.5763 61.2148 11.8092H70ZM61.3378 10.3072C61.6085 8.82731 62.8881 7.72289 64.6107 7.72289C66.3826 7.72289 67.5145 8.76104 67.7852 10.3072H61.3378Z" fill="#586D8C"/>
</svg>
它创建一个在角上带有字母“ e”的框。我想将字母更改为某些符号(在我的情况下-逻辑运算符“ NOT”符号)。我发现我可以如下使用text
标签:
<svg width="80" height="50" xmlns="http://www.w3.org/2000/svg">
<g>
<title>background</title>
<rect fill="none" id="canvas_background" height="402" width="582" y="-1" x="-1"/>
</g>
<g>
<title>Layer 1</title>
<rect x="0.114941" y="0.229882" id="svg_1" fill-opacity="0.09" fill="#497284" rx="4" height="50" width="80"/>
<path id="svg_2" fill="#586D8C" d="m57.5,34c4.1421,0 7.5,-3.3579 7.5,-7.5c0,-4.1421 -3.3579,-7.5 -7.5,-7.5c-3.803,0 -6.9451,2.8306 -7.434,6.5l-37.066,0l0,3l37.2697,0c0.8752,3.1711 3.7808,5.5 7.2303,5.5z" clip-rule="evenodd" fill-rule="evenodd"/>
<text transform="matrix(1.6882815594622569,1.3037036829424493,-58.03884193994182,9.82972205136589) " xml:space="preserve" text-anchor="start" font-family="Helvetica,Arial,sans-serif" font-size="24" id="svg_7" y="10.069448" x="66.18055" stroke-width="0" fill="#586D8C">¬</text>
</g>
</svg>
但是我不愿意。我正在尝试找到一种使用path
标签创建该符号的方法。所需的最终结果应该是:
实现它的正确方法是什么?