Canvas clip() အမိန့်

Canvas ကိုးကား

အသုံးပြုခြင်း နှင့် အသုံးချက်

clip() အရင်းဘာသာ ပုံပြင် မှ အမျိုးမျိုးသော ပုံပြင် နှင့် အရွယ်အစား ကို ကန့်သတ်တာ

အကြောင်းကြားအခြား အောက်ပါ ပြီးခဲ့သော ဖော်ပြမှု အား ပြောင်းလဲ() အောက်မှ ကန့်သတ်ထားသော အရေအတွက် ကို ကျော်ဖြတ်တာ (ဘာသာ အခြေခံ ပုံပြင် အခြား အရေအတွက် ကို မကူညီတော့ပါ)။ သို့သော်လည်း သင် ကန့်သတ်ထားသော အရေအတွက် ကို ကျော်ဖြတ်() အမိန့် အချက်အလက် အချိန် ကျသော် အရေအတွက် ကို ကယ်တင်ထားတာ ကို ကူညီပေးတာ ပြီး အခြား အချက်အလက် အချိန် ကျသော် ကယ်တင်ထားသော အရေအတွက် ကို ပြန်လည် ပြင်ဆင်တာ ကူညီပေးတာ ပြီး (ပြန်လည် ကယ်တင်() အမိန့် အချက်အလက် အချိန် ကျသော် ကယ်တင်ထားသော အရေအတွက် ကို ပြန်လည် ပြင်ဆင်တာ)

အမှတ်

ဂရင်းမှ 200*120 ပုံအချက် ပုံပြင် နိဂုံး ကန့်သတ်တာ။ ပြီးနောက် ဂရင်းအရောင် ပုံပြင် ဖော်ပြတာ။ ကန့်သတ်ထားသော နိဂုံး ပုံပြင် အချို့သည် နှင့်သာ အရောင်ဖြင့် ဖော်ပြတာ

သင်၏ ဘရောက်သုံး ဘာသာ အခြေခံ ကျော်ဖြတ် အောက်ပါ အချက်အလက် ကို ကူညီပေးတာ မဟုတ်ပါ

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
// ပြောင်းလဲ() အောက်မှ ပုံပြင် နိဂုံး ကန့်သတ်တာ
ctx.rect(50,20,200,120);
ctx.stroke();
ctx.clip();
// ပြောင်းလဲ() ပြီးနောက် ဂရင်းနိဂုံး အောက်မှ ဂရင်းအရောင် ပုံပြင် ဖော်ပြတာ
ctx.fillStyle="green";
ctx.fillRect(0,0,150,100);

ကိုယ်တိုင် စမ်းသပ်ပါ

အက္ခရာ

context.clip();

အော်ဒီယို ထောက်ပံ့

အချက်အလက် အရ ထို အခြေအနေ ကို ပထမဆုံး အထောက်ပံ့သော အော်ဒီယို အဆင့် ကို ညွှန်ပြထားပါသည်။

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

စာကြောင်းInternet Explorer 8 နှင့် ပိုမိုကြီးသော အော်ဒီယို များ <canvas> အားကစားအက်ဥ် ကို ထောက်ပံ့မပဲ။

Canvas ကိုးကား