javascript - 没有 xlink 的 SVG textPath

Question

是否可以内联定义 textPath 的路径，而不是创建 def 并将其作为 xlink:href 作为属性引用？

  <defs>
    <path id="MyPath"
          d="M 100 200 
             C 200 100 300   0 400 100" />
  </defs>

  <use xlink:href="#MyPath"/>

  <text>
    <textPath xlink:href="#MyPath">
      My text along a path
    </textPath>
  </text>

那么有没有可能有类似的东西

<text>
    <textPath path="M 100 200 C 200 100 300 0 400 100">
        My text along a path
    </textPath>
</text>

这行不通，但像这样？

Answer 1

这是一个feature在新的 SVG 2 规范中，您将使用路径属性。

浏览器正在实现新的 SVG 2 功能。下面的示例在 Firefox 中确实有效，但不确定其他地方。

html, body {
  height: 100%;
  width: 100%;
}

<svg height="100%" width="100%">
  <text>
    <textPath path="M 100 200 C 200 100 300 0 400 100">
        My text along a path
    </textPath>
  </text>
</svg>