9.11 SVG 文本（text）

传统图像中的文本实际上是已经栅格（像素）化为了点阵图，并不再具备文本的特性。 而SVG图像中的文本由于是独立对象存在，要灵活得多，可以实现更多的图文交互效果，而且可以被搜索引擎所索引。 不过SVG文本不能自动换行，不适合用来描述大段动态文本，这是一个缺点。

text 标签

text 标签用来创建SVG文本元素。

例子1 - 简单文本和变换

代码如下：

代码解释如下：

• x="" 指明文字的左下角的X坐标。如果定义的属性值没有给出单位，则缺省是当前用户坐标系的单位，缺省值为0。
• y="" 指明文字的左下角的Y坐标。缺省值为0。
• fill="" 用来指明文本的填充颜色。
• transform 用来定义SVG的基本变换，后续进阶课程里将集中描述。这里定义了一个简单的文本旋转。

例子2 - 多行文本

<text> 元素可以通过 <tspan> 元素来分组成多行来显示。每个 tspan 元素可以定义自己独特的格式和位置。

代码如下：

例子3 - 链接文本

和HTML文档类似，SVG中也可以使用链接元素，和文本结合构成跳转链接文本。

代码如下：

代码解释如下：

• xmlns:xlink=""这一句引入了xlink命名空间，以支持链接元素属性定义。
• xlink:href和html中的a链接类似，只是多了xlink的命名空间前缀，用来表示链接的目的地址。