Il grosso delle interazioni che GRITS ha con Canvas avviene attraverso il rendering delle immagini

nel canvas stesso. Per poter disegnare un'immagine nel canvas, dobbiamo prima caricarla.

Per caricare un immagine abbiam bisogno di creare un nuovo oggetto immagine, che

in Javascript comprende 3 passaggi: numero 1, bisogna dichiarare

l'oggetto immagine, numero 2, bisogna definire la sua funzione onload e poi, numero 3,

dobbiamo configurare l'attributo 'image.source'. E' bene notare che nel momento in cui

si assegna un valore alla proprieta' source, Javascript lancera'

la funzione onload. Per questo motivo dobbiamo prima specificare la funzione di callback,

prima di preparare l'attributo source, altrimenti l'immagine carichera' i dati

e non avra' un callback per riceverli.

Diamo ora un'occhiata a questo codice: ecco la URL dell'immagine che vorremmo

che tu caricassi. Vorremmo che tu creassi un nuovo oggetto immagine, seguendo

i passaggi summenzionati e configurassi la funzione onload e la proprieta' source

dell'immagine descritta nel codice. Assicurati che alla funzione onload sia

assegnata questa onImageLoad quaggiu', che in effetti stampera' un bel

messaggino nel log della console, informandoti del fatto che le cose son state caricate

a dovere. Se non ti rendi conto se l'immagine sia stata o meno caricata,

non dimenticarti di controllare gli Strumenti per Sviluppatori di Chrome nella scheda "rete", che mostrera'

se l'immagine sia stata o meno caricata e quanto ci ha messo.