The TextMetrics
interface represents the dimension of a text in the canvas, as created by the CanvasRenderingContext2D.measureText()
method.
TextMetrics.width
Read only
double
giving the calculated width of a segment of inline text in CSS pixels. It takes into account the current font of the context.TextMetrics.actualBoundingBoxLeft
Read only
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.TextMetrics.actualBoundingBoxRight
Read only
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.TextMetrics.fontBoundingBoxAscent
Read only
double
giving 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.TextMetrics.fontBoundingBoxDescent
Read only
double
giving 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.TextMetrics.actualBoundingBoxAscent
Read only
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.TextMetrics.actualBoundingBoxDescent
Read only
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.TextMetrics.emHeightAscent
Read only
double
giving 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.TextMetrics.emHeightDescent
Read only
double
giving 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.TextMetrics.hangingBaseline
Read only
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.TextMetrics.alphabeticBaseline
Read only
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.TextMetrics.ideographicBaseline
Read only
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.Specification | Status | Comment |
---|---|---|
WHATWG HTML Living Standard The definition of 'TextMetrics' in that specification. | Living Standard | Initial definition |
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 4.0 | (Yes) | 1.5 (1.8) | 9.0 | 9.0 | 3.1 |
width | 4.0 | (Yes) | 1.5 (1.8) | 9.0 | 9.0 | 3.1 |
actualBoundingBoxLeft ,actualBoundingBoxRight ,fontBoundingBoxAscent ,fontBoundingBoxDescent ,actualBoundingBoxAscent ,actualBoundingBoxDescent ,emHeightAscent ,emHeightDescent ,hangingBaseline ,alphabeticBaseline ,ideographicBaseline
| (Yes)[1] | ? | No support[2] | ? | ? | ? |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | 2.1 | (Yes) | 1.0 (1.8) | ? | 10.0 | 3.2 |
width | 2.1 | (Yes) | 1.0 (1.8) | ? | 10.0 | 3.2 |
actualBoundingBoxLeft ,actualBoundingBoxRight ,fontBoundingBoxAscent ,fontBoundingBoxDescent ,actualBoundingBoxAscent ,actualBoundingBoxDescent ,emHeightAscent ,emHeightDescent ,hangingBaseline ,alphabeticBaseline ,ideographicBaseline
| ? | ? | No support[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.
CanvasRenderingContext2D
.<canvas>
element and its associated interface, HTMLCanvasElement
© 2005–2017 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/TextMetrics