www.fabiobeta.itSu queste pagine potete trovare esperienze, idee ed esperimenti di un programmatore in cerca di metodi per lavorare meglio e meno.
Questi sono i post più apprezzati del sito, dateci un'occhiata:
SFTP automatico e natalizio con ANT
La mia cassetta degli attrezzi: Il portatile
III: Tu non commenterai invano
Eclipse: Propaganda a suon di keystroke
Gli altri sono qui.
HTML canvas: draw in your browser
6 Ottobre 2006
Se non avete un browser un minimo moderno, non garantisco per l'aspetto di questo post...
Non so come capiti a voi, ma per me in questo mondo sommerso di nuove tecnologie-tecniche-linguaggi un punto importante nel processo di apprendimento è usare le nuove conoscenze per farci qualcosa di interesante o divertente.
Così, quando ho "scoperto" che esisteva un tag html (<canvas>) per gestire elementi grafici direttamente nel browser (senza interventi lato server... molto Web2.0 ;)) ho continuato a ripromettermi per un po' di vedere come funzionava... campa cavallo. Poi, il colpo di "fortuna": chiacchierando con un amico ci viene in mente che sarebbe simpatico poter mettere un grafico a radar "dinamico" in un pagina web. Quindi, ecco qui il risultato:
Red:
Blu:
Raggi:
Carino no? :) In pratica un canvas è una "cornice" piazzata nella pagina su cui è possibile disegnare con comandi javascript. Con la nascita continua di applicazioni via web penso si sentirà presto il bisogno di elementi grafici dinamici. Le potenzialità ci sono tutte.
Per non farsi troppe illusioni però evidenzio anche qualche difetuccio in cui mi sono scontrato: al momento non è banale immettere testo nell'immagine (infatti gli assi del grafico non hanno nome...). Non c'è traccia della possibilità di rendere salvabile l'immagine visualizzata. E, ovviamente, l'elemento canvas viene riconosciuto solo dai browser di ultima generazione (non funziona neanche su firefox 1.0!).
Per chi volesse cimentarsi in altri esperimenti, un minimo di bibliografia:
- un tutorial su canvas
- Il mio tutorial javascript preferito, indispensabile