In most browsers the ctx.measureText() method returns an object with only a width property on it. actualBoundingBoxAscent & actualBoundingBoxDescent are in the spec but not implemented yet by any browser. because of this only fonts of normal proportions will have correct height values, things like condensed fonts will be off. We measure the widt…

gistfile1.txt

var measureText = function (ctx,font,text) {
  ctx.font = font;
  var width = ctx.measureText(text).width;
  var metrics = ctx.measureText('M');
  return  {width:width, height: metrics.width + (metrics.actualBoundingBoxAscent||0) + (metrics.actualBoundingBoxDescent||0)};
};