مетод Canvas strokeText()

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

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

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

مثال

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

صفحه مرورگر شما پلاگین HTML5 canvas را پشتیبانی نمی‌کند.

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";
// ایجاد سایه رنگی
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 اختیاری است. عرض بیشینه متن به پیکسل.

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

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

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

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