Google Chart API: grafici dinamici in un attimo

Pubblicato da Davide, Aggiornato domenica 20 aprile 2008 4 Commenti »

Questo articolo e' stato scritto piu' di 6 mesi fa.. In teoria non cambia nulla, sed panta rei: se trovi link o informazioni datate segnalalo pure. :)

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.

risultati senato

Se vi interessa anche la Camera dei Deputati.. Tanto ormai avrete capito che vivo in Emilia. :)

risultati camera

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:

cartina europa

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.

4 Commenti »

Puoi lasciare un tuo commento, oppure fare un trackback dal tuo sito.

  1. 1

    gravatar

    ottimo, per bongoblog potrei utilizzarlo per fare torte e statistiche.

  2. 2

    gravatar

    …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. 3

    gravatar

    [...] 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. 4

    gravatar

    [...] formula magica usa le Google Chart API (ovvero un insieme di procedure disponibili ai programmatori web per ottenere dei grafici a partire [...]

Lascia il tuo commento

 

http://livregratis.fr/ - http://club-ebook.fr/

Utilizzando il sito, accetti l'utilizzo dei cookie da parte nostra. maggiori informazioni

Questo sito utilizza i cookie per fonire la migliore esperienza di navigazione possibile. Continuando a utilizzare questo sito senza modificare le impostazioni dei cookie o clicchi su "Accetta" permetti al loro utilizzo.

Chiudi