# getContext method

The `getContext` method sets the context for drawing before working with the canvas. In the first parameter of the method, specify the context type - `'2d'` or `'3d'`, and in the second - its attributes.

## Syntax

`canvas.getContext(context type, attributes);`

## Example

Let's make the `getContext` canvas and give it a transparent background via the `alpha` attribute to show the browser the presence of an alpha channel:

`<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>` `const canvas = document.getElementById("canvas"); const ctx = canvas.getContext('2d', {alpha: true}); ctx.rect(50, 50, 100, 100); ctx.fillStyle = 'red'; ctx.fill();`

:

## Example

Now let's make an opaque background:

`<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>` `const canvas = document.getElementById("canvas"); const ctx = canvas.getContext('2d', {alpha: false}); ctx.rect(50, 50, 100, 100); ctx.fillStyle = 'red'; ctx.fill();`

:

←
↑
en ru