closePath နည်းလမ်း
closePath နည်းလမ်းသည်
lineTo နည်းလမ်းဖြင့် ရေးဆွဲထားသော
ပုံသဏ္ဍာန်ကို အလိုအလျောက် ပိတ်သိမ်းပေးပြီး၊ အဆုံးအမှတ်မှ စတင်အမှတ်သို့
မျဉ်းဖြောင့်တစ်ကြောင်း ရေးဆွဲပေးသည်။ အကယ်၍ ပုံသဏ္ဍာန်သည် အရင်ကတည်းက
ပိတ်နှင့်ပြီးဖြစ်သည် သို့မဟုတ် အမှတ်တစ်ခုတည်းသာ ဖြစ်နေပါက ၎င်းနည်းလမ်းသည်
ဘာမျှ လုပ်ဆောင်ပေးမည် မဟုတ်ပါ။
ဝါကျဖွဲ့စည်းပုံ
context.closePath();
နမူနာ
ပထမဦးစွာ၊ မျဉ်းနှစ်ကြောင်းကို
closePath ဖြင့် မပိတ်ဘဲ ရေးဆွဲကြည့်ပါမည်။
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let 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 ဖြင့် ပိတ်သိမ်းလိုက်ခြင်းဖြင့် တြိဂံပုံ ရရှိပါမည်။
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let 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 ဖြင့် ပုံသဏ္ဍာန်ကို ပိတ်သိမ်းကာ စတုရန်းပုံငယ်တစ်ခု ရေးဆွဲကြည့်ပါမည်။
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let 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();
:
ဆက်လက်လေ့လာရန်
-
fillနည်းလမ်း၊
အရောင်တစ်မျိုးမျိုးဖြင့် ပုံသဏ္ဍာန်ကို ဖြည့်ပေးသည်
