HTML canvas transform() နည်းလမ်း
ဥပမာ
ထောင့်မှန်စတုဂံတစ်ခုဆွဲပါ၊ အသွင်ပြောင်းမက်ထရစ်အသစ်ကို transform() ဖြင့် ထောင့်မှန်စတုဂံကို ထပ်မံဆွဲပါ၊ အသွင်ပြောင်းမက်ထရစ်အသစ်တစ်ခုထည့်ပါ၊ ထို့နောက် စတုဂံကို ထပ်မံဆွဲပါ။ သင် transform() ကို ခေါ်တိုင်း ၎င်းသည် ယခင် transformation matrix ပေါ်တွင် တည်ဆောက်ထားကြောင်း သတိပြုပါ။
JavaScript-
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "yellow";
ctx.fillRect(0, 0, 250, 100)
ctx.transform(1, 0.5, -0.5, 1, 30, 10);
ctx.fillStyle = "red";
ctx.fillRect(0, 0, 250, 100);
ctx.transform(1, 0.5, -0.5, 1, 30, 10);
ctx.fillStyle = "blue";
ctx.fillRect(0, 0, 250, 100);
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် နည်းလမ်းကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးသည်။
| Method | |||||
|---|---|---|---|---|---|
| transform() | Yes | 9.0 | Yes | Yes | Yes |
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
ကင်းဗတ်ပေါ်ရှိ အရာတစ်ခုစီတွင် လက်ရှိအသွင်ပြောင်းလဲခြင်း matrix ရှိသည်။
transform() method သည် လက်ရှိ transformation matrix ကို အစားထိုးသည်။ ၎င်းသည် ဖော်ပြထားသော matrix နှင့် လက်ရှိအသွင်ပြောင်း matrix ကို မြှောက်ပေးသည်။
| a | ဂ | င |
| ခ | ဃ | f |
| ၀ယ်တယ်။ | ၀ယ်တယ်။ | ၁ |
တစ်နည်းဆိုရသော် transform() method သည် သင့်အား အတိုင်းအတာ၊ လှည့်ပတ်၊ ရွှေ့ကာ လက်ရှိအကြောင်းအရာကို လှည့်နိုင်သည်။
မှတ်ချက် ။
မှတ်ချက်- transform() method သည် rotate(), scale(), translate(), သို့မဟုတ် transform() ဖြင့် ပြုလုပ်ထားသော အခြားသော transformation များနှင့် အတော်လေး သက်ဆိုင်ပါသည်။ ဥပမာ- သင့်ပုံဆွဲခြင်းကို နှစ်ချက်စကေးသတ်မှတ်ထားပြီးဖြစ်ပြီး၊ transform() method သည် သင့်ပုံများကို နှစ်ဆင့်ဖြင့် စကေးပေးမည်ဆိုပါက၊ သင်၏ပုံများသည် ယခုအခါ လေးခုဖြင့် စကေးပေးပါမည်။
အကြံပြုချက်- အခြားသော အသွင်ပြောင်းမှုများနှင့် ယှဉ်တွဲမ လုပ်ဆောင်နိုင်သော setTransform() နည်းလမ်းကို စစ်ဆေးကြည့်ပါ ။
| JavaScript syntax- | context .transform( a,b,c,d,e,f ); |
|---|
ကန့်သတ်တန်ဖိုးများ
| Parameter | Description | Play it |
|---|---|---|
| a | Horizontal scaling | |
| b | Horizontal skewing | |
| c | Vertical skewing | |
| d | Vertical scaling | |
| e | Horizontal moving | |
| f | Vertical moving |
❮ HTML Canvas အကိုးအကား