ملخص HTML canvas lineCap

دليل مرجعي HTML5 Canvas

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

lineCap يحدد أو يعيدها أو يضبط نمط الرأس في نهاية الخط.

ملاحظة:"round"و"square"سيجعل الخط يطول قليلاً.

مثال

خط النهاية المستدير للرسم الكروي:

متصفحك لا يدعم علامة الجدولية للرسم.

جافا سكربت:

تعريف دالة c للحصول على العنصر من خلال المعرف myCanvas;
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.lineCap="round";
ctx.moveTo(20,20);
ctx.lineTo(20,200);
ctx.stroke();

جرب بنفسك

النحو

context.lineCap="butt|round|square";

قيمة الخاصية

القيمة الوصف
butt افتراضي. إضافة حواف مستقيمة إلى كل نهاية للخط.
round إضافة رأس دائري إلى كل نهاية للخط.
square إضافة رأس مربع إلى كل نهاية للخط.

تفاصيل التقنية

القيمة الافتراضية: butt

دعم المتصفح

الرقم في الجدول يشير إلى إصدار المتصفح الأول الذي يدعم هذه الخاصية بالكامل.

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

ملاحظة:Internet Explorer 8 وأحدث إصداراته لا يدعم عنصر <canvas>.

دليل مرجعي HTML5 Canvas