Question

我有SVG元素，我想通过内部的x和y轴对齐文本。

<svg width="90px" height="90px" viewBox="-9 -3 90 76" style="border: 1px solid black;">
  <g>
     <text>Lorem</text>
  </g>
</svg>

我该怎么做？感谢您的提示。

P.S。我无法更改SVG元素的viewBox和大小，也无法将文本从g元素移到外部。

Answer 1

检查以下代码段：

<svg width="90px" height="90px" viewBox="-9 -3 90 76" style="border: 1px solid black;">
   <g>
      <text x="40%" y="50%" text-anchor="middle">Lorem</text>
   </g>
</svg>

您可以在此答案中找到更多信息：How to place and center text in an SVG rectangle

Answer 2

我不知道这是你要找的东西

     <text x="45" y="0">Lorem</text>

在SVG元素内对齐文本

2 个答案: