在svg里，text元素可以内嵌 textPath 标签令文本沿着指定路径布局。我们需要事先用 defs 标签定义所需路径并给路径指定 id 以便将来引用。在text标签里，要呈现的文本应该放在 textPath 标签内。textPath 标签首先用 href="#路径id"（建议）或 xlink:href="#路径id" 指明要引用的路径，然后使用 textPath 专有属性 startOffset（开始偏移量）定位文本。以下演示，我们用use标签实例化路径出于方便观察效果：

代码：

需要注意的是，文本置入textPath之后，文本的坐标系会跟随路径的坐标系，有可能因为路径的弯曲程度造成文本被挤压等现象，若此，可以考虑给textPath加入一个 textLength 属性，调整其值到合适的尺寸，例如，以上面的演示示例为例，可以这样：textLength="180"。

前一篇: svg文本对齐演示
下一篇: 没有了