Canvas measureText() Methode

Canvas-Referenzhandbuch

Definition und Verwendung

measureText() Die Methode gibt ein Objekt zurück, das die Breite des angegebenen Zeichensatzes in Pixeln enthält.

Hinweis:Wenn Sie die Breite des Texts vor dem Schreiben auf das Canvas kennen möchten, verwenden Sie diese Methode.

Beispiel

Überprüfen Sie die Breite des Zeichensatzes, bevor Sie Text auf das Canvas schreiben:

Ihr Browser unterstützt das HTML5 Canvas-Tag nicht.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="30px Arial";
var txt="Hallo Welt"
ctx.fillText("Breite:" + ctx.measureText(txt).width,10,50)
ctx.fillText(txt,10,100);

Versuchen Sie es selbst

Grammatik

Kontext.measureText(text).width;

Parameterwert

Parameter Beschreibung
text Der zu messende Text.

Browser-Unterstützung

Die in der Tabelle genannten Zahlen geben die erste Version des Browsers an, die diese Eigenschaft vollständig unterstützt.

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

Anmerkung:Internet Explorer 8 und frühere Versionen unterstützen das <canvas>-Element nicht.

Canvas-Referenzhandbuch