The TextMetrics interface represents the dimension of a text in the canvas, as created by the CanvasRenderingContext2D.measureText() method.
Properties
- TextMetrics.widthRead only
- Is a doublegiving the calculated width of a segment of inline text in CSS pixels. It takes into account the current font of the context.
- TextMetrics.actualBoundingBoxLeftRead only
- Is a doublegiving the distance parallel to the baseline from the alignment point given by theCanvasRenderingContext2D.textAlignproperty to the left side of the bounding rectangle of the given text, in CSS pixels.
- TextMetrics.actualBoundingBoxRightRead only
- Is a doublegiving the distance parallel to the baseline from the alignment point given by theCanvasRenderingContext2D.textAlignproperty to the right side of the bounding rectangle of the given text, in CSS pixels.
- TextMetrics.fontBoundingBoxAscentRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineattribute to the top of the highest bounding rectangle of all the fonts used to render the text, in CSS pixels.
- TextMetrics.fontBoundingBoxDescentRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineattribute to the top of the bounding rectangle of all the fonts used to render the text, in CSS pixels.
- TextMetrics.actualBoundingBoxAscentRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineattribute to the top of the bounding rectangle used to render the text, in CSS pixels.
- TextMetrics.actualBoundingBoxDescentRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineattribute to the bottom of the bounding rectangle used to render the text, in CSS pixels.
- TextMetrics.emHeightAscentRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineproperty to the top of the em square in the line box, in CSS pixels.
- TextMetrics.emHeightDescentRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineproperty to the bottom of the em square in the line box, in CSS pixels.
- TextMetrics.hangingBaselineRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineproperty to the hanging baseline of the line box, in CSS pixels.
- TextMetrics.alphabeticBaselineRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineproperty to the alphabetic baseline of the line box, in CSS pixels.
- TextMetrics.ideographicBaselineRead only
- Is a doublegiving the distance from the horizontal line indicated by theCanvasRenderingContext2D.textBaselineproperty to the ideographic baseline of the line box, in CSS pixels.
Specifications
| Specification | Status | Comment | 
|---|---|---|
| WHATWG HTML Living Standard The definition of 'TextMetrics' in that specification. | Living Standard | Initial definition | 
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari | 
|---|---|---|---|---|---|
| Basic support | 4.0 | 1.5 (1.8) | 9.0 | 9.0 | 3.1 | 
| width | 4.0 | 1.5 (1.8) | 9.0 | 9.0 | 3.1 | 
| actualBoundingBoxLeft,actualBoundingBoxRight,fontBoundingBoxAscent,fontBoundingBoxDescent,actualBoundingBoxAscent,actualBoundingBoxDescent,emHeightAscent,emHeightDescent,hangingBaseline,alphabeticBaseline,ideographicBaseline | (Yes)[1] | Not supported[2] | ? | ? | ? | 
| Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | 
|---|---|---|---|---|---|
| Basic support | 2.1 | 1.0 (1.8) | ? | 10.0 | 3.2 | 
| width | 2.1 | 1.0 (1.8) | ? | 10.0 | 3.2 | 
| actualBoundingBoxLeft,actualBoundingBoxRight,fontBoundingBoxAscent,fontBoundingBoxDescent,actualBoundingBoxAscent,actualBoundingBoxDescent,emHeightAscent,emHeightDescent,hangingBaseline,alphabeticBaseline,ideographicBaseline | ? | Not supported[2] | ? | ? | ? | 
[1] To turn on advanced text metrics, set the flag ExperimentalCanvasFeatures to true.
[2] Gecko does not implement this feature yet. See the related bug 1102584.
See also
- Creator method in CanvasRenderingContext2D.
- The <canvas>element and its associated interface,HTMLCanvasElement