Html 在周围添加填充/边距/背景（<；文本>；SVG中的标记

正在尝试在SVG中设置“text”标记的样式。例如，在文本周围添加填充/边距/边框、背景。但是，只能使用过滤器添加背景

我尝试在文本周围添加背景色和填充/边距。但找不到在文本周围添加边距/填充的方法

在SVG中添加文本标记，如下所示

<defs>
   <filter x="0" y="0" width="1" height="1" id="textStyle">
      <feFlood height="40" floodColor="green" 
       floodOpacity="0.08"/>
      <feComposite in="SourceGraphic" operator="xor" />
   </filter>
</defs>

<text filter="url(#textStyle)"
 x={xCoOrd}
 y={yCoOrd} 
 fill="red">
</text>

---

预期文本与附件类似。

您确实需要使用javascript计算文本边界，然后在文本元素之前添加一个rect。或者使用HTML文本而不是SVG文本。@RobertLongson谢谢。实际上，我需要坐标来放置元素（这被放置在图表中）。所以在这里使用svg文本。