Text 如何相对于svg文本的远端放置符号（路径）？

我正在开发一个生成SVG映射的程序。有些地图项目的标题后面需要符号（如机场标题的飞机符号）

如果我有一个文本元素

<text x="30" y="30">Pericles</text>

伯里克利 我可以在下一个字符位置放置另一段文字

<text x="30" y="30">Pericles <tspan>!</tspan></text>

伯里克利！ 但我想在那个位置用元素画我自己的符号

我现在正在做的是让生成程序从字体度量表等中猜测文本的范围，但这不够精确，无法一致地放置符号

---

有没有办法解决这个问题？比如在绘制文本时指定要使用的标记，并使用带有不可见破折号的tspan或其他东西来放置标记？

我能想到的最直接的解决方案仍然非常复杂，在某些SVG浏览器中无法工作：

将包含符号的tspan设置为类似于

my symbol font

的字体。然后使用SVG字体标准创建字体。您只需要在您的情况下定义一个字符（或字形），因为您只需要替换一个符号。将图示符定义为要用于替换

的符号

并将字形的unicode设置为

。可能是这样的：

`<glyph unicode="!">`

``

您应该仔细阅读，以获得关于如何实现这一点的确切细节，但是如果浏览器支持SVG字体，它应该可以工作。我知道WebKit（Safari/Chrome）支持它们，但Firefox（至少3.5版）不支持。（5月3日至6日，我还没有检查）

另外，如果您有Adobe Illustrator，一个可能有用的技巧是使用WingDings字体，使用普通文本和最后一个字符创建SVG。保存时，Illustrator将询问您是否希望使用SVG字体将使用的字体嵌入SVG。您可以指定只对SVG中使用的字符（而不是整个字体集）执行此操作。然后，您可以将SVG视为文本，查看它是如何创建wingdings字体和单个字形的，甚至可以复制整个内容，并将字体名称更改为您要使用的名称，将字形路径更改为符号路径。事实上，当我和Illustrator一起在电脑前时，我可能会自己尝试这样做。我会张贴一个样本，如果它的工作方式，我期望它

祝你好运。
通过使用脚本，可以将任何标记放在你想要的地方。例如，您可以使用
yourTextElm.getBBox（）
查找文本的结尾，或者如果您需要更具体一点，可以使用

如果您需要它是完全静态的，而不需要编写脚本，那么定义一种字体来拥有您需要的形状可能是一种方法。如果需要，您可以定制truetype字体，这将适用于所有支持webfonts的浏览器（如果您担心firefox目前不支持svgfonts）。
Opera和WebKit都支持简单的svgfonts，这基本上是SVG Tiny 1.2中定义的，请参阅。还不支持更高级的标志符号定义（读取：元素中的任意元素）。和任意元素与现在的标志符号定义有什么区别？如何定义wingding glyph？区别在于，在当前的浏览器实现中，您只能在元素上使用“d”属性来定义glyph。你也可以用它来做一些非常巧妙的事情，例如链式SVGFont：