Die getContext-metode

Die metode getContext stel die konteks vir teken vas voordat met die kanvas gewerk word. In die eerste parameter van die metode spesifiseer ons die tipe konteks - '2d' of '3d', en in die tweede - sy eienskappe.

Sintaksis

javascriptcanvas.getContext(konteks tipe, eienskappe);

Voorbeeld

Kom ons maak 'n doek met getContext en stel 'n deursigtige agtergrond vir dit deur middel van die eienskap alpha, wat aan die blaaier die teenwoordigheid van 'n alfakanaal aandui:

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();

Результат:

Voorbeeld

En nou, laat ons 'n ondeursigtige agtergrond maak:

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();

Результат: