مетод strokeText() کانواس HTML

دستنوشتار کانواس HTML5

تعریف و استفاده

strokeText() روش در کانواس متن را رسم می‌کند (بدون رنگ‌دهی). رنگ پیش‌فرض متن سیاه است.

نکته:لطفاً از font ویژگی برای تعریف فونت و اندازه آن استفاده می‌کند و strokeStyle ویژگی‌ها با رنگ/رنگ‌gradient دیگری برای رندر متن استفاده می‌شوند.

مثال

از روش strokeText() استفاده کنید تا متن "Hello world!" و "codew3c.com" را روی کانواس بنویسید:

مرورگر شما پشتیبانی از تگ کانواس HTML5 را ندارد.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="20px Georgia";
ctx.strokeText("Hello World!",10,50);
ctx.font="30px Verdana";
// ایجاد رنگ‌gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// با استفاده از تدریجی رنگ‌ها پرکنی کنید
ctx.strokeStyle=gradient;
ctx.strokeText("codew3c.com",10,90);

آزمایش کنید

نحوه نوشتن

context.strokeText(text,x,y,maxWidth);

مقدار پارامتر

پارامتر توضیح
text متنی که در کانواس نمایش داده می‌شود.
x موقعیت x برای شروع رسم متنی (مقابل کانواس).
y موقعیت y برای شروع رسم متنی (مقابل کانواس).
maxWidth اختیاری. عرض بیشینه متنی به پیکسل.

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگری است که این ویژگی را کاملاً پشتیبانی می‌کند.

کروم آنگه فایرفاکس سافاری اپرا
کروم آنگه فایرفاکس سافاری اپرا
4.0 9.0 3.6 4.0 10.1

نکته:نسخه‌های 8 اینترنت اکسپلورر و قدیمی‌تر از عنصر <canvas> پشتیبانی نمی‌کنند.

دستنوشتار کانواس HTML5