Ввод элементов SVG рядом друг с другом

У меня есть <text> и элемент <rect>, вложенный в элемент svg. Я хочу, чтобы элемент <rect> начинался сразу после окончания <text>. Но похоже, что я должен их разместить, используя x и y.Ввод элементов SVG рядом друг с другом

Есть ли способ разместить их рядом друг с другом, как обычные элементы HTML?

<svg> 
<text>1200</text> 
<rect width='120' height='12'></rect> 
</svg>

источник

2015-04-08 Arian Hosseinzadeh

через JavaScript, звоните getComputedTextLength(), чтобы получить длину текста и установить для него значение x. –

Любой чистый HTML/CSS способ сделать это? –

Только в том случае, если текст исправлен, и вы заработали его заранее. Даже тогда это, вероятно, будет только правильным для одного браузера на одном O/S –

я только кажется, чтобы быть в состоянии получить его с этим:

<svg height="30" width="100"> 
    <text x="0" y="15" fill="red">SVG TEXT!</text> 
</svg> 
<svg height="30" width="100"> 
    <rect width='120' height='12'></rect> 
</svg>

Смотрите в Pen 'SVG Text и Box Test' Джеймса Алмейда здесь: http://codepen.io/jimmyplaysdrums/pen/ZYdEyw/

источник

2015-04-08 22:43:05 jimmyplaysdrums

Ввод элементов SVG рядом друг с другом

ответ

Смежные вопросы