Gráficas a través de Google Chart API

Hace poco empecé a probar la API de Google Chart, un nuevo servicio web disponible que nos permite a través de una url y una serie de parámetros obtener -sin instalar nada- un gráfico que puede ser embebido en nuestro sitio web.

Lo estoy usando para desarrollos internos, y la verdad que simplifica bastante el trabajo al evitar muchos problemas, desde instalar herramientas, librerías, configuración, curva de aprendizaje, etc.

Ejecutar las primeras pruebas que aparecen en la documentación puede dar la impresión que todo es muy sencillo, pero cuando queremos obtener algo que se ajuste exactamente a nuestras necesidades es casi seguro que pasaremos algunas horas de "prueba y error" hasta lograr entener todos los parámetros y cómo cambian de acuerdo al tipo de gráfico.

Es un servicio gratuito y no tiene límites, aunque hay que avisar en caso de superar los "250,000 API calls per day".

Aquí un ejemplo de una url donde simplemente hay que pasar parámetros con los valores necesarios. Esta misma url la podemos agregar dentro de un <IMG> y como el resultado es una imágen .PNG, automáticamente la podemos tener embebida en nuestro sitio:




Lo bueno es que también puedo de forma muy simple enviar el link por mail a un usuario a partir de la url generada con los datos de mi sistema.

Aquí les dejo un ejemplo:

1  
<?php
2  
3  
foreach( $this->ventas as $venta ){
4     
$dia[] = $venta['dia'];
5     
$cant[] = $venta['cantidad'];
6  }
7  
8  
$chx implode"|"$dia );
9  
$chd implode","$cant );
10  
11  
$pars = array(
12     
"http://chart.apis.google.com/chart?chs=1000x300",
13     
"cht=ls",
14     
"chxt=x,y",
15     
"chds=1,100",
16     
"chxl=0:|" $chx "|1:|0|50mil|100mil|150mil|200mil",
17     
"chtt=Ventas por Dia",
18     
"chd=t:" $chd,
19     
"chm=D,C6D9FD,1,0,8|D,4D89F9,0,0,4",
20     
"chg=20,50,1,0"
21  
);
22  
23  
$url implode"&"$pars );
24  
25  
?>
26  
<table border=1 align="center">
27   <tr>
28    <td>
29     <img src="<?php echo $url ?>" alt="Ventas por Dia"/>
30    </td>
31   </tr>
32  </table>
33  
34  



Tal vez no sea lo mejor para todos los contextos, pero lo bueno es que usamos una herramienta de Google que está probada y tiene un respaldo de calidad detrás, como así también nos libera de tener que instalar librerías en nuestro servidor, ancho de banda y tiempo de procesador para generar los gráficos.

Por el momento me está siendo muy útil ;-)

7 comentarios:

freezer dijo...

Enrique has tenido problemas con ñ o acentos

saludos

freezer

freezer dijo...

Muchas gracias Enrique veo que estas atento a los comentarios

enrique_place dijo...

Estimado Freezer:

Lamentablemente y por tema de tiempo no puedo responder todos los comentarios ni todos los correos en tiempo y forma (entre medio trabajo, tengo familia y vida personal), pero sí, siempre los leo y en el momento que los recibo.

En el post hay un link que apunta a un enlace que tiene un tilde, por consiguiente la respuesta parecía obvia.

PD: sería bueno primero buscar en los manuales o hacer pequeñas pruebas a depender que alguien te responda inquietudes a medida (no siempre pueden estar disponibles).

freezer dijo...

Muy bien enrique, aunque a decir verdad lo habia resuelto hace dias, suelo dejar este tipo de comentarios para saber si los autores estan vivos o han pasado a mejor vida..

tu PD, es eso que llaman ironia?

un saludos

PD: Cuendo se tiene un martillo en la mano se suelen ver puros clavos

enrique_place dijo...

Estimado Freezer:

Sí, es ironía... pedir a los demás que resuelvan nuestros propios problemas, y cuando no lo hacen, molestarse.

Bien podrías haber compartido tu solución antes de quejarte por la no respuesta.

destor77 dijo...

muy buen post enrique, has vistos ejemplos en los que se hacen gráficos descendentes es decir que el eje y en vez de salir 1 2 3 4 5 6 salga 6 5 4 3 2 1.
En muchas librerías hacer esto es muy complicado en google char api, no he visto ejemplos, sera muy complicado.

salu2

enrique_place dijo...

Estimado Destor77:

No, aún no lo he probado, pero estoy en camino a hacerlo, ya que tengo pesando para los próximos desarrollos de surforce usar esta API y ver cómo nos va ;-)

Entradas populares