طريقة HTML canvas closePath()

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

closePath() لإنشاء مسار من النقطة الحالية إلى نقطة البداية.

إشارة:استخدم هذه الطريقة stroke() لرسم المسار المحدد على الرسم البياني.

إشارة:استخدم هذه الطريقة fill() استخدم هذه الطريقة لتعبئة الصورة (للبدء هي السوداء). يرجى استخدام fillStyle استخدم خصائص لتعبئة لون آخر/تدرج.

المثال

مثال 1

رسم مسار شكل L، ثم رسم خطوط لتعود إلى نقطة البداية:

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

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.closePath();
ctx.stroke();

جربها بنفسك

إشارة:يوجد المزيد من الأمثلة في قاعدة البيانات في أسفل الصفحة.

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

context.closePath();

مزيد من الأمثلة

مثال 2

استخدم اللون الأخضر كألوان التعبئة:

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

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.closePath();
ctx.stroke();
ctx.fillStyle="green";
ctx.fill();

جربها بنفسك

دعم المتصفحات

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

كروم إدج فايرفوكس سفاري أوبرا
كروم إدج فايرفوكس سفاري أوبرا
4.0 9.0 3.6 4.0 10.1

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