JavaScript ဖြင့် Canvas အသုံးပြု၍ စက်ဝိုင်းများ ဆွဲခြင်း
နောက်ထပ် နည်းလမ်း arc သည်
အချို့သော ဗဟိုတစ်ခုတွင် ကွေးညွှတ်သော မျဉ်းကို ဆွဲသည်။ ၎င်းသည် အောက်ပါ
အညွှန်းများကို လက်ခံသည်။ x, y, အချင်း r,
အစတည့်ချွန်း startAngle, အဆုံးတည့်ချွန်း
endAngle, နာရီလက်တံအတိုင်း သို့မဟုတ် ဆန့်ကျင်ဘက်
ဆွဲရန် direction.
အညွှန်း direction သည် အောက်ပါတန်ဖိုးများကို လက်ခံသည်။ true သည်
နာရီလက်တံအတိုင်း ဆွဲရန် လုပ်ဆောင်ပေးသည်၊ false သည် နာရီလက်တံဆန့်ကျင်ဘက် (မူလအတိုင်း)။
ဤနည်းလမ်း arc တွင် တည့်ချွန်းများကို ရေဒီယန်များဖြင့် တိုင်းတာသည်။
ဒီဂရီများဖြင့် မဟုတ်ပါ။ ဒီဂရီများမှ ရေဒီယန်များသို့ ပြောင်းလဲရန်
အောက်ပါ လုပ်ဆောင်ချက်ကို သင်အသုံးပြုနိုင်သည်။
function getRadians(degrees) {
return (Math.PI / 180) * degrees;
}
စက်ဝိုင်းတစ်ခု ဆွဲကြမည်
<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
ctx.arc(100, 100, 75, 0, getRadians(360));
ctx.stroke();
:
စက်ဝိုင်းတစ်ဝက် ဆွဲကြမည်
<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.stroke();
:
စက်ဝန်းတစ်ဝက် ဆွဲကြမည်
<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.fill(); // ကွင်းဆက်ကို အရောင်ဖြည့်မည်
: