v144 · graphics

Enhanced Canvas TextMetrics

Expand the TextMetrics Canvas API to support selection rectangles, bounding box queries, and glyph cluster-based operations.

concepts

  1. Rich TextMetrics

    Canvas measureText() now returns per-line and per-glyph bounding rects. Lets canvas-based editors draw exact hit-tests and selections without manual layout.

  2. Hit-test Canvas Text

    Click anywhere on rendered canvas text; caretPositionFromPoint maps the pixel to a string index and getSelectionRects paints the caret. The canvas-editor motivation in one screen.

  3. Selection Drag

    Click and drag across canvas text to highlight it. getSelectionRects paints the highlight bands across wrapped lines — the missing primitive every canvas-based editor used to fake with manual layout.

  4. Font Inspector

    Type any text, pick a font family and size, and see all 12 measureText() properties visualized as annotated lines on canvas — em box, actual bounding box, baseline, ideographic baseline — with a live values table.

why it shipped

The existing TextMetrics API provides measurements for atomic text, but offers no facilities to break down that information to a more granular level.

references