demo · v144

Rich TextMetrics

Type text, drag the size slider — the canvas draws the string and overlays the per-glyph bounding rects measureText() now returns. Hover a glyph to see its exact metrics. Falls back to a manual measurement when Chrome 144 metrics aren't there.

Enhanced TextMetrics support: checking…
hover a glyph to inspect its bounding rect

the API

const m = ctx.measureText("Hello");
console.log(m.getSelectionRects(0, 5));        // NEW
console.log(m.getActualBoundingBox(0, 5));     // NEW
// Per-glyph cluster info enables hit-testing without DOM layout.

see also