HTML canvas measureText() metod

Definition och användning

measureText() Metoden returnerar ett objekt som innehåller den specificerade teckensnittets bredd i pixlar.

Tips:Om du behöver veta textens bredd innan den skrivs ut på canvas, använd denna metod.

Exempel

Kontrollera teckensnittets bredd innan du skriver ut text på canvas:

Din webbläsare stöder inte HTML5 canvas-taggen.

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);

Prova själv

Syntax

context.measureText(text).width;

Parametervärde

Parameter Beskrivning
text Text att mäta.

Webbläsarstöd

Numreringen i tabellen anger den första webbläsarversionen som helt stöder denna egenskap.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Kommentar:Internet Explorer 8 och tidigare versioner stöder inte <canvas>-elementet.