为什么文本路径没有呈现？

Question

我真的很困惑为什么这两个文字没有沿着线和路径显示。有人能指出我吗？

  <svg width="300px" height="300px">
    <line id="ok" x1="10" y1="20" x2="100" y2="100" stroke="red" stroke-width=10>
      <text>
        <textPath stroke="black" xlink:href="#ok">OHHHHSUHDIAU</textPath>
      </text>
    </line>
    <path id="io" d="M10,10 L100,10" stroke="blue" stroke-width=10>
      <text>
        <textPath stroke="black" xlink:href="#io">io</textPath>
      </text>
    </path>
  </svg>

Answer 1

您只能在<textPath>

上执行<path>

将<text>置于<line>或<path>元素内导致它们无法呈现。

这是我对你想要完成的事情的最好猜测，我希望这会有所帮助

<svg width="300px" height="300px">
  <defs>
    <path id="io" d="M10,10 L100,10" />
    <path id="ok" d="M10,20 L100,100" />
  </defs>
  <use xlink:href="#io" stroke-width="10" stroke="blue" />
  <use xlink:href="#ok" stroke-width="10" stroke="red" />
  <text>
    <textPath stroke="black" xlink:href="#io">io</textPath>
    <textPath stroke="black" xlink:href="#ok">OHHHHSUHDIAU</textPath>
  </text>
</svg>