Los atributos de `width` y `height` controlarán el tamaño del `canvas`. Estos atributos controlan el tamaño del `canvas` de dibujo, no el tamaño real renderizado. Consulte la página "Dimensiones del Canvas" para obtener más información.
Para usar un `canvas` , primero debemos tomar el elemento de la página como un elemento DOM, y luego obtener un contexto de dibujo de él.
```js
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext('2d');
```
Todas las llamadas de dibujo después de esto se harán desde el objeto `ctx` . El `ctx` representa el contexto de dibujo del objeto y contiene información sobre el espacio de dibujo 2D. El objeto `canvas` es el elemento DOM real. Interactuar con él nos permite acceder a atributos como el `width` y el `height` .
Hay algunos contextos de dibujo disponibles, incluyendo `webgl` . WebGL es realmente una tecnología completamente diferente, por lo que solo nos centraremos en el dibujo 2D.
Los caminos son el bloque de construcción del dibujo en `canvas` . Vea la página de ' [Rutas](/articles/canvas/paths) ' para más.
