طريقة measureText() لـ HTML canvas

التعريف والاستخدام

measureText() يستخدم هذا الطريقة لتقديم موضوع يحتوي على عنصر يحتوي على عرض النص بالبكسل.

نصيحة:إذا كنت بحاجة إلى معرفة عرض النص قبل إخراجه على اللوحة، فاستخدم هذه الطريقة.

مثال

قبل إخراج النص على اللوحة، تأكد من عرض النص:

متصفحك لا يدعم علامة التبويب HTML5 canvas.

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

تجربة شخصية

النحو

السياق.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>.