A canvas measureText example

function canvasReady() {
  draw(document.getElementById('canvas').getContext('2d'));
}
function draw(ctx) {
    ctx.translate(-10, 5);
    ctx.scale(1.2, 0.8);
    ctx.rotate(5 * Math.PI / 180);

  var fillText = "measureText";

  ctx.textBaseline = "top";
  ctx.font = "32pt Arial";

  ctx.fillStyle = "red";
  ctx.fillText(fillText, 20, 20);

  var dim = ctx.measureText(fillText);
  ctx.font = "16pt Serif";

  ctx.fillStyle = "orange";
  ctx.fillText(["width:", Math.round(dim.width), "px,",
                "height:", Math.round(dim.height || 0), "px"].join(" "), 20, 80);
}