HTML canvas measureText () method
Examples
Before the canvas text output, check the font width:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="30px Arial";
var txt="Hello World"
ctx.fillText("width:" + ctx.measureText(txt).width,10,50)
ctx.fillText(txt,10,100);
var ctx=c.getContext("2d");
ctx.font="30px Arial";
var txt="Hello World"
ctx.fillText("width:" + ctx.measureText(txt).width,10,50)
ctx.fillText(txt,10,100);
try it"
Browser Support
Internet Explorer 9, Firefox, Opera, Chrome and Safari support measureText () method.
Note: 8 and earlier versions of Internet Explorer do not support the <canvas> element.
Definition and Usage
measureText () method returns an object that contains the specified font in pixels of width.
Tip: If you need to output text to the canvas before, I understand the width of the text, use this method.
JavaScript syntax: | context.measureText (text) .width; |
---|
Parameter Value
参数 | 描述 |
---|---|
text | 要测量的文本。 |
HTML canvas Reference Manual