پیشنهاد دوره:
روش Canvas closePath()
تعریف و استفاده
closePath()
توجه:از روشی برای ترسیم مسیر دقیق روی کanvas استفاده کنید. روشی برای ایجاد مسیر از نقطه فعلی به نقطه شروع ایجاد میکند. stroke()
توجه:از روشی برای ترسیم مسیر دقیق روی کanvas استفاده کنید. fill() از روشی برای پر کردن تصویر استفاده کنید (پیشفرض سیاه است). لطفاً از fillStyle از یک رنگ/تدرج رنگ دیگر برای پر کردن استفاده کنید.
مثالها
مثال 1
یک مسیر را با شکل حرف L ترسیم کنید و سپس خطوط را برای بازگشت به نقطه شروع ترسیم کنید:
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
سبز را به عنوان رنگ پرکن استفاده کنید:
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();
پشتیبانی مرورگر
اعداد در این جدول نشاندهنده نسخهای از مرورگر هستند که اولین بار این ویژگی را کامل پشتیبانی میکند.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
نکته:نسخههای 8 و قدیمیتر از Internet Explorer از عنصر <canvas> پشتیبانی نمیکنند.