---
title: "TextMetrics | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Interface TextMetrics

The **`TextMetrics`** interface represents the dimensions of a piece of text in the canvas; a TextMetrics instance can be retrieved using the CanvasRenderingContext2D.measureText() method.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics)

interface TextMetrics {  
    [actualBoundingBoxAscent](#actualboundingboxascent): number;  
    [actualBoundingBoxDescent](#actualboundingboxdescent): number;  
    [actualBoundingBoxLeft](#actualboundingboxleft): number;  
    [actualBoundingBoxRight](#actualboundingboxright): number;  
    [alphabeticBaseline](#alphabeticbaseline): number;  
    [emHeightAscent](#emheightascent): number;  
    [emHeightDescent](#emheightdescent): number;  
    [fontBoundingBoxAscent](#fontboundingboxascent): number;  
    [fontBoundingBoxDescent](#fontboundingboxdescent): number;  
    [hangingBaseline](#hangingbaseline): number;  
    [ideographicBaseline](#ideographicbaseline): number;  
    [width](#width): number;  
}

##### Index

### Properties[](#properties)

[actualBoundingBoxAscent](#actualboundingboxascent) [actualBoundingBoxDescent](#actualboundingboxdescent) [actualBoundingBoxLeft](#actualboundingboxleft) [actualBoundingBoxRight](#actualboundingboxright) [alphabeticBaseline](#alphabeticbaseline) [emHeightAscent](#emheightascent) [emHeightDescent](#emheightdescent) [fontBoundingBoxAscent](#fontboundingboxascent) [fontBoundingBoxDescent](#fontboundingboxdescent) [hangingBaseline](#hangingbaseline) [ideographicBaseline](#ideographicbaseline) [width](#width)

## Properties[](#properties-1)

### `Readonly`actualBoundingBoxAscent[](#actualboundingboxascent)

actualBoundingBoxAscent: number

The read-only **`actualBoundingBoxAscent`** property of the TextMetrics interface is a double giving the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline attribute to the top of the bounding rectangle used to render the text, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxAscent)

### `Readonly`actualBoundingBoxDescent[](#actualboundingboxdescent)

actualBoundingBoxDescent: number

The read-only **`actualBoundingBoxDescent`** property of the TextMetrics interface is a double giving the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline attribute to the bottom of the bounding rectangle used to render the text, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxDescent)

### `Readonly`actualBoundingBoxLeft[](#actualboundingboxleft)

actualBoundingBoxLeft: number

The read-only **`actualBoundingBoxLeft`** property of the TextMetrics interface is a double giving the distance parallel to the baseline from the alignment point given by the CanvasRenderingContext2D.textAlign property to the left side of the bounding rectangle of the given text, in CSS pixels; positive numbers indicating a distance going left from the given alignment point.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxLeft)

### `Readonly`actualBoundingBoxRight[](#actualboundingboxright)

actualBoundingBoxRight: number

The read-only **`actualBoundingBoxRight`** property of the TextMetrics interface is a double giving the distance parallel to the baseline from the alignment point given by the CanvasRenderingContext2D.textAlign property to the right side of the bounding rectangle of the given text, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/actualBoundingBoxRight)

### `Readonly`alphabeticBaseline[](#alphabeticbaseline)

alphabeticBaseline: number

The read-only **`alphabeticBaseline`** property of the TextMetrics interface is a double giving the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline property to the alphabetic baseline of the line box, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/alphabeticBaseline)

### `Readonly`emHeightAscent[](#emheightascent)

emHeightAscent: number

The read-only **`emHeightAscent`** property of the TextMetrics interface returns the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline property to the top of the em square in the line box, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/emHeightAscent)

### `Readonly`emHeightDescent[](#emheightdescent)

emHeightDescent: number

The read-only **`emHeightDescent`** property of the TextMetrics interface returns the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline property to the bottom of the em square in the line box, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/emHeightDescent)

### `Readonly`fontBoundingBoxAscent[](#fontboundingboxascent)

fontBoundingBoxAscent: number

The read-only **`fontBoundingBoxAscent`** property of the TextMetrics interface returns the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline attribute, to the top of the highest bounding rectangle of all the fonts used to render the text, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/fontBoundingBoxAscent)

### `Readonly`fontBoundingBoxDescent[](#fontboundingboxdescent)

fontBoundingBoxDescent: number

The read-only **`fontBoundingBoxDescent`** property of the TextMetrics interface returns the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline attribute to the bottom of the bounding rectangle of all the fonts used to render the text, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/fontBoundingBoxDescent)

### `Readonly`hangingBaseline[](#hangingbaseline)

hangingBaseline: number

The read-only **`hangingBaseline`** property of the TextMetrics interface is a double giving the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline property to the hanging baseline of the line box, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/hangingBaseline)

### `Readonly`ideographicBaseline[](#ideographicbaseline)

ideographicBaseline: number

The read-only **`ideographicBaseline`** property of the TextMetrics interface is a double giving the distance from the horizontal line indicated by the CanvasRenderingContext2D.textBaseline property to the ideographic baseline of the line box, in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/ideographicBaseline)

### `Readonly`width[](#width)

width: number

The read-only **`width`** property of the TextMetrics interface contains the text's advance width (the width of that inline box) in CSS pixels.

[MDN Reference](https://developer.mozilla.org/docs/Web/API/TextMetrics/width)