Komma igång med canvas i JavaScript
Canvas är ett speciellt ritfält
i webbläsaren med JavaScript. Detta fält skapas
med hjälp av taggen <canvas>, som
man bör ange bredd och höjd för:
<canvas width="200" height="200"></canvas>
För att arbeta med detta fält i JavaScript måste vi först få en referens till denna tagg i någon variabel:
let canvas = document.querySelector('canvas');
Sedan måste metoden getContext appliceras
på denna variabel:
let canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');
Det kan förenklas:
let ctx = document.querySelector('canvas').getContext('2d');
Som ett resultat kommer objektet ctx att innehålla
ett så kallat
exekveringskontext. All ritning
kommer att ske med hjälp av metoderna i detta
objekt. Vi kommer att studera dessa i nästa
lektioner.