Gráficas de datos con Google Chart

La API de google charts nos brinda una forma sencilla de generar una gráfica; mediante una petición http, esta API remota, genera una imagen dinámica de tipo PNG que podemos colocar en cualquiera de nuestras páginas web.

La sintaxis de uso es la siguiente:

Código :

http://chart.apis.google.com/chart?<parameter 1>&<parameter 2>&<parameter n> 

Los parámetros mas comunes son:

• "chs" especifica el tamaño de la gráfica, valor en pixeles* ( obligatorio )
  
• "cht" es el tipo de gráfico. ( obligatorio )
  
• "chd" son los datos del gráfico. ( obligatorio )
  
• "chl" la etiqueta del gráfico. [ opcional ]
  

Ahora veamos la API en acción:




e.g. http://chart.apis.google.com/chart?cht=p3&chd=t:90,10&chs=250x100&chl=PacMan|Boca

La url de la gráfica puede ser fácilmente insertada en una etiqueta <img> para el propósito que deseen.

Además del pastel (gráfica circular), podemos encontrar otros que van desde el gráfico de barras hasta diagramas de Venn o Mapas.

Código :

http://chart.apis.google.com/chart?
chs=450x200&
cht=gom&
chd=t:10&
chl=nivel%20de%20tip&
chco=eeeeff,0000aa

Código :

http://chart.apis.google.com/chart?
cht=t&
chs=440x220&
chd=s:Af9&
chco=ffffff,edf0d4,13390a&
chld=COARPE&
chtm=south_america&
chf=bg,s,EAF7FE

Código :

http://chart.apis.google.com/chart?
cht=lxy&
chd=t:0,30,60,70,90,95,100|20,30,40,50,60,70,80|10,30,40,45,52|100,90,40,20,10|-1|5,33,50,55,7&
chs=250x100&
chco=000ff0,00ff00,0ff000

Código :

http://chart.apis.google.com/chart?
cht=lc&
chd=s:pqokeYONOMEBAKPOQVTXZdecaZcglprqxuux393ztpoonkeggjp&
chco=676767&
chls=4.0,3.0,0.0&
chs=200x125&
chxt=x,y&
chxl=0:|1|2|3|4|5|1:|0|50|100&
chf=c,lg,0,76A4FB,1,ffffff,0|bg,s,EFEFEF

Encontraran mas información en: http://code.google.com/intl/es/apis/chart/, por mi parte es todo y espero que esto les sirva mucho. Suerte.

*El área máxima para todos los gráficos, excepto para los mapas, es de 300.000 píxeles. El valor máximo de altura y ancho es de 1.000 píxeles.

 

Tweet