以文本方式查看主题

-  计算机科学论坛  (http://bbs.xml.org.cn/index.asp)
--  『 SVG/GML/VRML/X3D/XAML 』  (http://bbs.xml.org.cn/list.asp?boardid=21)
----  SVG中怎么实现按照曲线显示文字走向？  (http://bbs.xml.org.cn/dispbbs.asp?boardid=21&rootid=&id=40672)

--  作者：alex_chew
--  发布时间：11/30/2006 9:00:00 AM

--  SVG中怎么实现按照曲线显示文字走向？
我想沿着一条曲线显示“中文曲线走向”等几个中文字符，怎么做到？
--  作者：wenwu2008
--  发布时间：11/30/2006 4:33:00 PM

--  
在Text元素下添加 TextPath子元素，就可以了
--  作者：tamefox
--  发布时间：12/17/2006 3:38:00 PM

--  
svg规范中有相关的例子，我摘录了一个给你，具体可以参见
http://www.w3.org/TR/SVG/text.html#TextPathElement。如果看英文的比较吃力，可以参见中文书《基于XML的SVG应用指南》

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="12cm" height="3.6cm" viewBox="0 0 1000 300" version="1.1"
     xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs>
    <path id="MyPath"
          d="M 100 200
             C 200 100 300   0 400 100
             C 500 200 600 300 700 200
             C 800 100 900 100 900 100" />
  </defs>
  <desc>Example toap01 - simple text on a path</desc>
  <use xlink:href="#MyPath" fill="none" stroke="red"  />
  <text font-family="Verdana" font-size="42.5" fill="blue" >
    <textPath xlink:href="#MyPath">
      We go up, then we go down, then up again
    </textPath>
  </text>
  <!-- Show outline of canvas using 'rect' element -->
  <rect x="1" y="1" width="998" height="298"
        fill="none" stroke="blue" stroke-width="2" />
</svg>

W 3 C h i n a ( since 2003 ) 旗 下 站 点
苏ICP备05006046号《全国人大常委会关于维护互联网安全的决定》《计算机信息网络国际联网安全保护管理办法》
 78.125ms