1

現在、JavaScript の SVG 要素を使用しています。

これが私のシナリオです。

このような2つのテキスト要素を持つsvg要素があります

<svg>
  <g transform = "translate(0, 20)">
     <text style="font-size: 0.5em;" x="0" y="-4"> text </text>
     <text style="font-size: 0.5em;" x="70" y="-4"> value </text>
  </g> 
<svg>

このようにきれいに見えます

テキスト値

svg のサイズを変更するときにテキストのサイズを変更したいので、font-size 0.5em を使用しました (jquery resizable を使用して) 正常に動作します。ある時点でテストが非常に大きくなり、x 属性と y 属性が固定されているため、両方のテキストが互いに重なり合うようになります。

この問題を回避する方法はありますか?

ありがとう

4

1 に答える 1

4

単一のテキスト値への変換は、上で概説したユース ケースを満たすようです。テキストを相対的に配置する必要がある場合は、テキストを tspan に変換してから dx と dy を使用できます。<text>text <tspan dx="1em" dy="1em">value</tspan></text>

于 2012-07-28T11:34:22.037 に答える