Cos’è canvas e a cosa serve

Ultimamente si è sentito molto parlare di questa nuova tecnologia per il suo straordinario potenziale, vediamo insieme cos’è, come funziona e cosa può fare.Canvas è un elemento presente nell’html 5 e consente il rendering dinamico delle bitmap. Il suo utilizzo non è diverso da altri elementi html in quanto richiede un normale tag a chiusura esplicita.

<canvas></canvas>

Questo elemento permette il rendering dinamico di una bitmap, ovvero permette di definire una zona in cui è possibile “disegnare” l’immagine tramite uno script con l’ausilio di javascript.

Le applicazioni sono molteplici, si possono disegnare grafici di dati, elementi del layout e animazioni. Due delle applicazioni di maggiore successo negli ultimi tempi sono cufon che permette di sostituire il font presente nel sito con un font scelto e convertito da canvas e javascript. Protovis invece è uno script che permette grazie a javascript e canvas la realizzazione di grafici complessi.

Una nota negativa è presentata dalla compatibilità in quanto ad oggi la maggior parte dei browser supporta l’elemento canvas ad eccezione di Internet Explorer (versione 8 compresa), per gli amanti del browser microsoft esiste però excanvas (uno script javascript) in grado di supportare parzialmente canvas.

Personalmente ho fatto prova e vi propongo questo esempio per inserire angoli arrotondati su una foto senza png.

Trovo che esista un grande potenziale dietro a questo nuovo elemento, non ci resta che attendere l’arrivo dell’html 5 e lo sperato supporto da parte del browser microsoft.

Nell’attesa vi propongo qualche link per approfondire l’argomento:

Definizione di canvas su Wikipedia

Alcuni esempi e tutorial su mozilla developer

Script per animazioni con canvas

Esempio di visualizzazione di algoritmo con canvas

Esperimento con <canvas>, <video> e firefox 3.5

Info su Mauro Accornero

Sviluppatore e Web Designer Freelance, lavora a Milano dove collabora con Agenzie di Comunicazione ed Aziende del settore. Docente presso la Nuova Accademia di Belle Arti a Milano dove tiene corsi in ambito web per il dipartimento di Graphic Design e Art Direction.
Questa voce è stata pubblicata in Articoli, Tutorial e contrassegnata con , . Contrassegna il permalink.

Una risposta a Cos’è canvas e a cosa serve

Lascia un Commento

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati *

*

È possibile utilizzare questi tag ed attributi XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>