svg élément de texte de largeur

Question

Je travaille sur quelques ecmascript/javascript pour un fichier svg et besoin pour obtenir la largeur et la hauteur d'un élément de texte, donc je peux redimensionner un rectangle qui l'entoure. En html, je voudrais être en mesure d'utiliser le offsetWidth et offsetHeight les attributs de l'élément, mais il semble que ces propriétés ne sont pas disponibles.

Voici un fragment que j'ai besoin de travailler avec. J'ai besoin de changer la largeur du rectangle à chaque fois que je change le texte, mais je ne sais pas comment obtenir la largeur (en pixels) de l'élément de texte.

<rect x="100" y="100" width="100" height="100" />
<text>Some Text</text>

Des idées?

Answer 1

var bbox = textElement.getBBox();
var width = bbox.width;
var height = bbox.height;

et puis définissez l'rect attributs en conséquence.

Lien: getBBox() dans le SVG v1.1 standard.

Answer 2

Quant à la longueur du texte, le lien semble indiquer BBox et getComputedTextLength() peut retourner des valeurs légèrement différentes, mais ceux qui sont assez proches les uns des autres.

http://bl.ocks.org/MSCAU/58bba77cdcae42fc2f44