Google Chart API: grafici dinamici in un attimo
Pubblicato da Davide, Aggiornato domenica 20 aprile 2008 4 Commenti »
Le Google API Charts sono un insieme di procedure disponibili ai programmatori web per ottenere dei grafici a partire da un semplice url. Si tratta forse delle “Application Programming Interface” più semplici mai messe a disposizione da Google. Il servizio è gratuito, è possibile utilizzarlo senza dover registrare nessuna API key (come invece avviene per Google Maps API) e non ci sono limiti di interrogazioni.
All’interno di un indirizzo web vengono passati i dati per la costruzione del grafico, sottoforma di parametri, e Google ci restituisce una immagine realizzata a partire da quei dati. Quale migliore occasione dei dati elettorali per fare qualche prova?
La documentazione (in inglese) è impeccabile, sono presenti un sacco di esempi che aiutano lo sviluppatore. Ho costruito la torta dei risultati elettorali del mio paese, sulla base di questo url.
http://chart.apis.google.com/chart?chs=800x300&chd=t:0.88,4.1,0.27,0.43,2.96,23.69,6.69,2.19,0.46,4.55,52.33,0.51,0.58,0.37&cht=p3&chco=990000,ebebeb,d1dceb,000000,ff0000,0090ff,1db000,373737,fff94a,db4aff,31a142,ab4800,6e00a7,bc424b&chl=PARTITO%20COMUNISTA%20LAVORATORI|UDC|PARTITO%20LIBERALE%20ITALIANO|FORZA%20NUOVA|LA%20SINISTRA%20L'ARCOBALENO|IL%20POPOLO%20DELLA%20LIBERTA'|LEGA%20NORD|LA%20DESTRA|UNIONE%20PER%20I%20CONSUMATORI|ITALIA%20DEI%20VALORI|PARTITO%20DEMOCRATICO|SINISTRA%20CRITICA|PER%20IL%20BENE%20COMUNE|PARTITO%20SOCIALISTA
Vediamolo commentato:
http://chart.apis.google.com/chart?
chs=800x300 <!--dimensioni del grafico in pixel-->
&chd=t:4.1,2.96,23.69,6.69,2.19,4.55,52.33,0.37,3.12 <!--serie di dati: percentuali-->
&cht=p3 <!--tipo di grafico: a torta-->
&chco=ebebeb,ff0000,0090ff,1db000,373737,db4aff,31a142,bc424b,ffcc00 <!--colori delle fette--> &chl=UDC|SINISTRA%20L'ARCOBALENO|POPOLO%20DELLA%20LIBERTA'|LEGA%20NORD|LA%20DESTRA|ITALIA%20DEI%20VALORI|PARTITO%20DEMOCRATICO|PARTITO%20SOCIALISTA|ALTRI <!--etichette dei dati-->
Per ottenere l’immagine direttamente sulla pagina web, basta inserire l’url appena costruito nel tag <img> avendo cura di convertire i caratteri ‘&’ in ‘&’, in questo modo:
<img src="http://chart.apis.google.com/chart?
chs=800x300
&chd=t:4.1,2.96,23.69,6.69,2.19,4.55,52.33,0.37,3.12
&cht=p3
&chco=ebebeb,ff0000,0090ff,1db000,373737,db4aff,31a142,bc424b,ffcc00
&chl=UDC|SINISTRA%20L'ARCOBALENO|POPOLO%20DELLA%20LIBERTA'|LEGA%20NORD|LA%20DESTRA|ITALIA%20DEI%20VALORI|PARTITO%20DEMOCRATICO|PARTITO%20SOCIALISTA|ALTRI" alt="risultati senato" />
Ed ecco il risultato finale, per i voti al Senato della Repubblica.
Se vi interessa anche la Camera dei Deputati.. Tanto ormai avrete capito che vivo in Emilia. :)
Decisamente comodo il servizio, soprattutto se dobbiamo trattare dati variabili, magari estratti da un database: come dati finanziari o altro. Non a caso infatti il servizio è utilizzato su Google Finance.
L’unica cosa che mi lascia perplesso è l’impossibilità di scrivere i valori sul grafico, cosa che potrebbe essere utile soprattutto per i grafici a torta. Nei grafici a barre invece è possibile assegnare valori sugli assi.
Google fornisce anche un esempio di javascript per la realizzazione automatica di un grafico a partire da un array di dati. Se invece volete qualcosa di più visuale, c’è già chi ha pensato al Google Chart Generator oppure al Google Graph Builder, dove è possibile ottenere il codice dell’url grazie a un comodo editor on-line.
Ma non è finita qui, le APIs Chart permettono anche di creare grafici sulla base di cartine geografiche. Il concetto è sempre quello: un url con diversi parametri. Ed ecco che cosa si può ottenere:
Questo il codice:
<img src="http://chart.apis.google.com/chart?cht=t&chs=440x220&chd=s:Af9&chtm=europe&chco=ffffff,edf0d4,13390a&chld=FRITNL&chf=bg,s,EAF7FE" alt="cartina europa" />
Si potrebbe sfruttare per segnalare la presenza di dispositivi mobili su un’area geografica, colorando con un gradiente le aree più dense.. Insomma: in tutte quelle situazioni in cui c’è esigenza di mappare in maniere automatica dati in evoluzione.
Se penso al diffondersi dei palmari e alle crescenti esigenze di geolocalizzazone gli scenari sono molteplici. Ma anche senza vagare troppo con l’immaginazione, basta pensare alla monitorizzazione degli accessi a una pagina web, a sondaggi, alla pubblicazione di dati finanziari.. Quello di Google Charts è un servizio veloce (i tempi di risposta sono immediati) e soprattutto gratuito.
L’unico limite sono 250000 chiamate al giorno, se pensate di superarle meglio avvisare via mail.
Varie info
Articolo pubblicato domenica 20 aprile 2008 alle 18:49
Segnala questo articolo.. e sentiti utile!
4 Commenti »
Puoi lasciare un tuo commento, oppure fare un trackback dal tuo sito.
Lascia il tuo commento
1
Nicola Greco - Pubblicato il 30 04 2008 alle 18:51
ottimo, per bongoblog potrei utilizzarlo per fare torte e statistiche.
2
giovani - Pubblicato il 10 12 2008 alle 17:02
…non ne esco…. sto “giocando” con i grafici di google da un paio d’ore ma proprio non capisco. L’obiettivo e’ quello di realizzare un grafico della crescita di mio figlio (un obiettivo e’ fondamentale per lavorare su qualcosa!!), ma il grafico che mi restituisce google, e’ …. piccolo, nel senso che i punti da me dati vengono tutti rappresentati in una moneta da 1 centesimo. Vero e’ che i dati sono tutti nel range fra 1 e 10 e che potrei aumentarli cambiando l’unita’ di misura, ma mi aspetterei che il grafico venisse scalato automaticamente e che soprattutto cio’ che indico negli assi come range di dati venisse rispettato nel disegno dei punti.
Hai qualche suggerimento?
questo e’ il mio url
grazie
3
Highcharts: grafici interattivi con jquery ottimizzati anche per iPhone / Android - diploD - Pubblicato il 17 02 2011 alle 18:52
[...] potrebbe tornare utile in diverse applicazioni stand-alone, a costo zero. Ben diverso dal classico Google Charts, servizio comodissimo che però pecca in quanto ad interattività: all’utente viene infatti [...]
4
Google Docs può generare automaticamente i QR Codes - Pubblicato il 02 10 2013 alle 06:30
[...] formula magica usa le Google Chart API (ovvero un insieme di procedure disponibili ai programmatori web per ottenere dei grafici a partire [...]