Get pixel length of String in Svg

Question

I\'m currently working with SVG. I need to know the string length in pixels in order to do some alignment. How can I do to get the length of a string in pixel ?

Answer 1

I've been wondering this too, and I was pleasantly surprised to find that, according to the SVG spec, there is a specific function to return this info: getComputedTextLength()

// access the text element you want to measure
var el = document.getElementsByTagName('text')[3];
el.getComputedTextLength(); // returns a pixel integer

Working fiddle (only tested in Chrome): http://jsfiddle.net/jyams/

Answer 2

Having read various similar threads with interest and benefitted from some of the ideas, I've created a page which compares three of the Javascript methods side-by-side. I've noted results in

IE9

Firefox 29.0.1 and

Chrome 34.0.1847.131 m

You can load it in your browser and see what works for you:

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