SVG & font metrics

Question

Is there any means to get font metrics in SVG? I'd like to get: descent, ascent, max height, advance.

I need this for drawing text & graphics together like in flowcharts.

For example, I need to draw a box around text, and to draw a connector line from the middle of ex-size(size of letter 'x'), and not from the center of the box side.

Answer 1

If you have DOM access then there are a number of SVG DOM methods for text elements. Then there's the getBBox method which is available on most svg elements.

If you're dealing with SVGFonts, then the data is already available in xml format as normal attributes, e.g ascent, descent etc.

For your use-case I'd recommend getBBox, since it can deal with graphic elements too (in case you ever want to add more things than just text to the charts).