未定义textpath上href的SVG名称空间前缀xlink

Question

所以我试图制作一个简单的文本路径.svg,它是一个带有一些文本的垂直线.我得到的问题是标签似乎抛弃了一切.我认为它与我的xlink:href有关但我似乎无法确切地说明究竟是什么.

<svg version="1.1"
     baseProfile="full"
     width="20" height="600"
     xmlns="http://www.w3.org/2000/svg">
     
   <defs>
          <path id="testPath" d="M 10 10 L 10 600 z"
         stroke="black" stroke-width="3" />
   </defs>
   
   <text>
      <textpath xlink:href="#testPath">
         teeeest
      </textpath>
   </text>
   
</svg>

任何帮助,将不胜感激.

Answer 1

SVG是一种区分大小写的语言,因此文本路径实际上需要写为textPath.

如果你在html中嵌入SVG,那么你不需要命名空间,因为html不支持它们(与xhtml不同).如果您拥有SVG独立版,则还需要xmlns:xlink="http://www.w3.org/1999/xlink"root <svg>元素.

Answer 2

您的示例将在浏览器中内联工作,因为浏览器知道xlink命名空间.

如果您的SVG是外部文件,则执行更严格的XML解析并且必须定义所有使用的命名空间.

您需要做的就是将xlink命名空间的定义添加到最外层<svg>元素.

<svg version="1.1"
    baseProfile="full"
    width="20" height="600"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink">