我需要画一个像这样的带有两个曲线字符串的红圆:
上面的字符串总是3个字符长,下面的字符串长度可以从1到20个字符不等。
更新1: 我尝试使用textpath和circle标签,但我认为我需要更改一些坐标:
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<circle cx="40" cy="40" r="24" style="stroke:#006600; fill:none"/>
<defs>
<path id="myTextPath"
d="M75,20
a1,1 0 0,0 150,0"
/>
</defs>
<text x="5" y="50" style="stroke: #000000;">
<textPath xlink:href="#myTextPath" >
string
</textPath>
</text>
</svg>
我并没有完全理解<path>
标签的 'd' 属性,但是我发现我可以将起始点更改为M10,20
,那么如何改变文本曲线的方向呢?
d="M10,20 a1,1 0 0,0 150,0"