HTML canvas measureText() 方法
定义和用法
measureText()
方法返回包含一个对象,该对象包含以像素计的指定字体宽度。
提示:如果您需要在文本向画布输出之前,就了解文本的宽度,那么请使用该方法。
实例
在画布上输出文本之前,检查字体的宽度:
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);
ภาษาคำสั่ง
context.measureText(text).width;
ปรากฏการณ์
ปรากฏการณ์ | คำอธิบาย |
---|---|
text | ข้อความที่ต้องการวัด |
การสนับสนุนโดยบราวเซอร์
ตัวเลขในตารางบอกว่าเวอร์ชั่นแรกที่สนับสนุนคุณสมบัตินี้คือบราวเซอร์ใด
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
หมายเหตุ:Internet Explorer 8 และเวอร์ชั่นเก่ากว่านี้ไม่สนับสนุนประกาย <canvas>