getContext နည်းလမ်း

getContext နည်းလမ်းသည် canvas နှင့် အလုပ်မလုပ်မီ ရေးဆွဲရန် context ကို သတ်မှတ်ပေးသည်။ နည်းလမ်း၏ ပထမသွင်းပါမှုတွင် context အမျိုးအစား - '2d' သို့မဟုတ် '3d' ကို ဖော်ပြပြီး၊ ဒုတိယသွင်းပါမှုတွင်မူ ၎င်း၏ attributes များကို ဖော်ပြရသည်။

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

javascriptcanvas.getContext(context အမျိုးအစား, attributes);

ဥပမာ

getContext နှင့် canvas တစ်ခုဖန်တီးပြီး၊ alpha channel ရှိကြောင်း ဘရောက်ဆာကို ပြသသည့် alpha attribute မှတစ်ဆင့် ၎င်းအား ဖောက်ထွင်းမြင်ရသော နောက်ခံကို သတ်မှတ်ကြပါစို့။

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

javascriptconst canvas = document.getElementById("canvas");
const ctx = canvas.getContext('2d', {alpha: true});

ctx.rect(50, 50, 100, 100);
ctx.fillStyle = 'red';
ctx.fill();

Результат:

ဥပမာ

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

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

javascriptconst canvas = document.getElementById("canvas");
const ctx = canvas.getContext('2d', {alpha: false});

ctx.rect(50, 50, 100, 100);
ctx.fillStyle = 'red';
ctx.fill();

Результат: