Comenzando con canvas en JavaScript
Canvas es un campo especial para dibujar
en el navegador usando JavaScript. Este campo se crea
usando la etiqueta <canvas>, a la cual
se le debe especificar un ancho y una altura:
<canvas width="200" height="200"></canvas>
Para trabajar con este campo en JavaScript, primero obtenemos una referencia a esta etiqueta en una variable:
let canvas = document.querySelector('canvas');
Luego, a esta variable es necesario aplicarle
el método getContext:
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
Se puede simplificar:
let ctx = document.querySelector('canvas').getContext('2d');
Como resultado, en la variable ctx se guardará
un objeto que contiene el llamado
contexto de renderizado. Todo el dibujo
se realizará utilizando los métodos de este
objeto. Estudiarlos es en lo que nos ocuparemos en las siguientes
lecciones.
