closePath နည်းလမ်း

closePath နည်းလမ်းသည် lineTo နည်းလမ်းဖြင့် ရေးဆွဲထားသော ပုံသဏ္ဍာန်ကို အလိုအလျောက် ပိတ်သိမ်းပေးပြီး၊ အဆုံးအမှတ်မှ စတင်အမှတ်သို့ မျဉ်းဖြောင့်တစ်ကြောင်း ရေးဆွဲပေးသည်။ အကယ်၍ ပုံသဏ္ဍာန်သည် အရင်ကတည်းက ပိတ်နှင့်ပြီးဖြစ်သည် သို့မဟုတ် အမှတ်တစ်ခုတည်းသာ ဖြစ်နေပါက ၎င်းနည်းလမ်းသည် ဘာမျှ လုပ်ဆောင်ပေးမည် မဟုတ်ပါ။

ဝါကျဖွဲ့စည်းပုံ

javascriptcontext.closePath();

နမူနာ

ပထမဦးစွာ၊ မျဉ်းနှစ်ကြောင်းကို closePath ဖြင့် မပိတ်ဘဲ ရေးဆွဲကြည့်ပါမည်။

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(100, 100);
ctx.lineTo(150, 50);
ctx.stroke();

Результат:

နမူနာ

ယခုတစ်ကြိမ်တွင်၊ ထိုမျဉ်းနှစ်ကြောင်းကို closePath ဖြင့် ပိတ်သိမ်းလိုက်ခြင်းဖြင့် တြိဂံပုံ ရရှိပါမည်။

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(100, 100);
ctx.lineTo(150, 50);
ctx.closePath(); // မျဉ်းများကို ပုံသဏ္ဍာန်အဖြစ် ပိတ်သိမ်းသည်
ctx.stroke();

Результат:

နမူနာ

နောက်ဆုံးမျဉ်းကို ရေးဆွဲမည့်အစား closePath ဖြင့် ပုံသဏ္ဍာန်ကို ပိတ်သိမ်းကာ စတုရန်းပုံငယ်တစ်ခု ရေးဆွဲကြည့်ပါမည်။

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.lineTo(150, 150);
ctx.lineTo(50, 150);
ctx.closePath(); // မျဉ်းများကို ပုံသဏ္ဍာန်အဖြစ် ပိတ်သိမ်းသည်
ctx.stroke();

Результат:

ဆက်လက်လေ့လာရန်