Canvas è un nuovo elemento di HTML5 che può essere utilizzato all’interno di una pagina web per
- scrivere testi, visualizzare immagini, disegnare grafici, rispondere agli eventi, riprodurre suoni
- realizzare applicazioni complesse all’interno di una pagina web: testi+immagini+suoni+interattività=giochi!
Perché si è affermato?
- Utilizza Javascript come linguaggio di scripting
- Lo standard è implementato in tutti i browser aggiornati
- È indipendente dalla piattaforma
- Rende superflui i plug-in proprietari: Flash, Java Applet, Shockwave, SilverLight, …
Difetti?
- Il suo sviluppo si sovrappone a quello dello standard SVG.
- La sua sintassi può risultare complessa: per questo sono disponibili molte librerie (kinetic.js, Easel.js, Fabric.js, Zebra) che semplificano le operazioni più frequenti e aumentano le sue potenzialità.
Risorse essenziali
In italiano
- HTML.IT > Canvas, guida pratica / Canvas, una tela trasparente
- Imparate a creare grafica Web con canvas in un’ora!
- PDF: APPRENDIMENTO HTML5-CANVAS
In inglese
- W3C: 2Dcontest
- MDN > Canvas / Drawing graphics
- Wikipedia: Canvas
- w3school > Canvas Reference / Canvas Tutorial / Canvas Clock
- Html5 Canvas Tutorials | Eloquent Javascript: Drawing on Canvas | HTML Canvas Deep Dive – github: canvasdeepdive-book | HTML Canvas API Tutorial | w3resource > HTML5 Canvas Tutorial | Canvas Tutorial (Breakout)
- Experiments with Google: Chrome Experiments
Molti linguaggi/software di successo sono stati portati in Canvas per renderli universali