在SVG中绘制的矩形之间插入文本

Question

我有一个SVG代码：

<svg width="100%" height="100%" version="1.1"xmlns="http://www.w3.org/2000/svg">
    <rect x="20" y="20" width="250" height="250" style="fill:blue">
        <animate attributeType="CSS" attributeName="opacity" from="1" to="0" dur="5s" repeatCount="indefinite" />
    </rect>
</svg>

现在我需要在这个矩形之间添加一段文本。有人能告诉我如何做吗？

- Maverick

---

我假设你在version和xmlns属性之间缺少空格只是在你的帖子中打错了吧？ - Phrogz

可能是Auto line-wrapping in SVG text的重复问题。 - Phrogz

Answer 1

我不确定您所说的"between"是什么意思。如果您的意思是水平和垂直居中，则可以使用以下代码：

<svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <rect x="20" y="20" width="250" height="250" style="fill:blue" />
  <text x="145" y="145" text-anchor="middle" alignment-baseline="middle">
    Hello World
  </text>
</svg>

你是不是想要询问其他内容？

如果你是在谈论如何让文本填充矩形，即文本可以自动折行到矩形的下一行，那么你应该查看这个Stack Overflow问题链接。

- Phrogz