上下標在SVG

Question

我想顯示標和上標與SVG使用下面的代碼from this site

<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
<g> 
    <text x = "10" y = "25" font-size = "20"> 
     <tspan> 
      e = mc 
      <tspan baseline-shift = "super">2</tspan> 
     </tspan> 
     <tspan x = "10" y = "60"> 
      T 
      <tspan baseline-shift = "sub">i+2</tspan> 
      =T 
      <tspan baseline-shift = "sub">i</tspan> 
      + T 
      <tspan baseline-shift = "sub">i+1</tspan> 
     </tspan> 
    </text> 
</g> 

不過分/標不會在IE或Firefox顯示。這是未實現還是存在另一個問題？ [？你能看到標顯示正確]

Answer 1

基線漂移不是在IE9，IE10和Firefox的支持，請參閱：

http://msdn.microsoft.com/en-us/library/gg558060(v=vs.85).aspx https://bugzilla.mozilla.org/show_bug.cgi?id=308338

如果你acually努力顯示公式，更適合將MATHML嵌入SVG，請參閱：

http://www.maths-informatique-jeux.com/international/mathml_with_other_standards/index.php

如果您想爲您提供的例子了一個quickfix，你可以模擬基線漂移與dy ...

<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
<g> 
    <text x = "10" y = "25" font-size = "20"> 
     <tspan> 
      e = mc 
      <tspan dy ="-10">2</tspan> 
     </tspan> 
     <tspan x = "10" y = "60"> 
      T 
      <tspan dy="10">i+2</tspan> 
      <tspan dy="-10">=T </tspan> 
      <tspan dy="10">i</tspan> 
      <tspan dy="-10">+ T</tspan> 
      <tspan dy="10">i+1</tspan> 
     </tspan> 
    </text> 
    </g> 
</svg> 

http://jsfiddle.net/UQ5Dp/