Ripassiamo le basi del canvas

In fondo creare un canvas non è poi così complicato.
A furia di fare infinite masturbazioni cerebrali sulle collisioni ottenute per mezzo dei movimenti del mouse stavo perdendo di vista la creazione di un canvas.
Ecco il codice, ripassiamolo...

var canvas;
var ctx;
var WIDTH;
var HEIGHT;
function initContext(nome){
 canvas=$(nome);
 ctx=canvas.getContext("2d");
 WIDTH=canvas.width;
 HEIGHT=canvas.height;
}

Dopo aver dichiarato le variabili necessarie creo il canvas e il contesto.
Più essenziale ancora:

var canvas;
var ctx;
function initContext(nome){
 canvas=$(nome);
 ctx=canvas.getContext("2d");
}

Dovrebbe funzionare: per verificarlo, disegniamoci un rettangolo...

var canvas;
var ctx;
function initContext(nome){
 canvas=$(nome);
 ctx=canvas.getContext("2d");
 ctx.fillStyle="dodgerblue";
 ctx.beginPath();
 ctx.rect(100,100,300,200);
 ctx.closePath();
 ctx.fill();
}

Ottimo! Almeno abbiamo ripassato le basi del canvas, che rischiavo di perdere di vista...