HTML canvas measureText() Method

Example

let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");

ctx.font = "10px monaco";
let txt = "Hello World"
ctx.fillText("width:" + ctx.measureText(txt).width, 10, 50)
ctx.fillText(txt, 10, 100);

Try this code ❯

Meaning

The measureText() method returns an object that contains the width of the specified text.

Standard Syntax

JavaScript syntax:

context.measureText(text).width;

Parameter Values

Parameter	Description
text	Specifies the text to be measured.