Metode Canvas measureText()

Definisi dan Penggunaan

measureText() Metode ini mengembalikan objek yang berisi lebar huruf yang ditentukan dalam piksel.

Peringatan:Jika Anda perlu mengetahui lebar teks sebelum menampilkan teks ke kanvas, gunakan metode ini.

Contoh

Sebelum menampilkan teks di atas kanvas, periksa lebar huruf:

Peramban Anda tidak mendukung tag HTML5 canvas.

JavaScript:

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

coba sendiri

gramata

konteks.measureText(text).width;

Nilai Parameter

Parameter Deskripsi
text Teks yang akan diukur.

Dukungan Browser

Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini penuh.

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

Keterangan:Internet Explorer 8 dan versi sebelumnya tidak mendukung elemen <canvas>.