Google Chart Tools: gráficos de datos en tu blog
Todo el mundo tiene su marca. Los hay apasionados por la Coca Cola, los hay de Alfa Romeo o los hay de Dolce & Gabbana. Yo soy de Google, lo reconozco. Por interés y beneficio, todo hay que decirlo.
Utilizo su buscador a diario, su plataforma de bitácoras de manera intensiva, su sistema de correo electrónico y su calendario me resulta muy útil, el lector de noticias y suscripción de feeds, tengo personalizado mi iGoogle.
No quiero olvidarme que controlo el tráfico de mis páginas y blogs, gano unos céntimos y planifico estrategias de posicionamiento, todo eso, utilizando sus herramientas. Además, utilizo sus API para mejorar la experiencia del usuario en los desarrollos que dirijo incluyendo herramientas tan dinámicas y potentes como Maps o Language. Y todo esto, por cero euros.
Por si fuera poco, entre los mastodontes empresariales actuales vinculados a las TIC, es el principal defensor de la neutralidad en la red -no sin alguna crítica al respecto de sus últimos posicionamientos- y el código abierto, siendo como es una empresa privada con accionistas que debe mirar antes por la rentabilidad del negocio que por filosofías a medio camino entre lo hacker y lo zen. Y todo esto, insisto, por cero euros.
Dicho esto, conocer todos los servicios y herramientas que tiene Google entre sus manos o está desarrollando es una tarea harto complicada. No pasa día en el que no descubres algo nuevo. Quizás lleva meses o años en funcionamiento pero no llega hasta ti hasta que lo necesitas. Es el caso de las Chart Tools, que descubro hoy (lanzada la versión beta en 2007 no se anunció su primera versión estable hasta febrero de 2010), una API tremendamente sencilla de utilizar que sirve para generar gráficos de representación de datos, fórmulas, esquemas (interpretando GraphViz), códigos de barra tipo QR (obsérvalo arriba y a la derecha, debajo de los iconos sociales, si tienes un software lector en tu móvil y lo utilizas, enfocando la cámara, abrirá el navegador web con la URL de este artículo), mapas geográficos de datos, entre otras opciones.
Primer consejo, si buscas "api charts google" y acabas en la página de documentación en español verás que... ¡no hay nada de información! Modifica la URL y en la especificación "es-ES" pones "en-GB". Como dice mi compañero, al final, lo verdaderamente interesante (en informática) siempre está en inglés.
Usarlo es tremendamente simple en lo que va siendo una tendencia en Google. Es decir, utilizar sus API vía una llamada a una URL que devuelve algo. En este caso llamamos a una URL con unos parámetros determinados que definen el gráfico a generar, devuelto en forma de imagen. La mejor manera, pues, de utilizarlo es a través de la etiqueta <img src="..." />. En tu editor de texto para las entradas de tu bitácora puedes incluirlos insertando una imagen y en origen (o fuente o URL) indicas la dirección de la API con sus parámetros.
Los gráficos inferiores de pastel o barras representan, ambos, la distribución porcentual de las fuentes de tráfico de este bitácora. La etiqueta que genera ese cada uno de ellos está justo debajo (separo en líneas los parámetros, aunque la URL se debe de indicar de manera continua):
<img src="https://chart.googleapis.com/chart?
cht=p3
&chs=400x100
&chd=t:45.25,37.45,16.36,0.94
&chl=45%|37%|16%|1%
&chdl=Buscadores|Referencia|Directo|Otros"
border="1" />
<img src="https://chart.googleapis.com/chart?
cht=bhs
&chs=400x200
&chd=t:45.25,37.45,16.36,0.94
&chxt=x,y
&chxl=1:|Otros|Directo|Referencia|Buscadores|0:|0%|20%|40%|60%|80%|100%
&chtt=Origen%20Tráfico%20Web|blog.artecar24.com"
border="1" />
Para los bitácoras dedicados a ciencias o matemáticas recomiendo investigar el apartado dirigido a generar fórmulas en formato gráfico. Evitarás tener que editar una imagen, con el engorro que eso supone, en un programa de edición de imágenes para luego subirlo a tu blog, con la ventaja añadida de permitir una rápida edición con sólo modificar los parámetros de la URL. La fórmula se especifica en el parámetro chl y se describe en lenguaje TeX (es aconsejable codificarla para evitar problemas con algunos carácteres).
En el ejemplo, la fórmula de la media aritmética (una apreciación sobre las fórmulas, el signo + hay que indicarlo en formato UNICODE, como %2B):
<img src="https://chart.googleapis.com/chart?
cht=tx
&chs=300x400
&chl=\bar{x} = \frac{x_1 %2B x_2 %2B ... %2B x_n}{n} = \frac{\sum_{i=1}^n x_i}{n}"
border="1" />
Utilizo su buscador a diario, su plataforma de bitácoras de manera intensiva, su sistema de correo electrónico y su calendario me resulta muy útil, el lector de noticias y suscripción de feeds, tengo personalizado mi iGoogle.
No quiero olvidarme que controlo el tráfico de mis páginas y blogs, gano unos céntimos y planifico estrategias de posicionamiento, todo eso, utilizando sus herramientas. Además, utilizo sus API para mejorar la experiencia del usuario en los desarrollos que dirijo incluyendo herramientas tan dinámicas y potentes como Maps o Language. Y todo esto, por cero euros.
Por si fuera poco, entre los mastodontes empresariales actuales vinculados a las TIC, es el principal defensor de la neutralidad en la red -no sin alguna crítica al respecto de sus últimos posicionamientos- y el código abierto, siendo como es una empresa privada con accionistas que debe mirar antes por la rentabilidad del negocio que por filosofías a medio camino entre lo hacker y lo zen. Y todo esto, insisto, por cero euros.
Dicho esto, conocer todos los servicios y herramientas que tiene Google entre sus manos o está desarrollando es una tarea harto complicada. No pasa día en el que no descubres algo nuevo. Quizás lleva meses o años en funcionamiento pero no llega hasta ti hasta que lo necesitas. Es el caso de las Chart Tools, que descubro hoy (lanzada la versión beta en 2007 no se anunció su primera versión estable hasta febrero de 2010), una API tremendamente sencilla de utilizar que sirve para generar gráficos de representación de datos, fórmulas, esquemas (interpretando GraphViz), códigos de barra tipo QR (obsérvalo arriba y a la derecha, debajo de los iconos sociales, si tienes un software lector en tu móvil y lo utilizas, enfocando la cámara, abrirá el navegador web con la URL de este artículo), mapas geográficos de datos, entre otras opciones.
Primer consejo, si buscas "api charts google" y acabas en la página de documentación en español verás que... ¡no hay nada de información! Modifica la URL y en la especificación "es-ES" pones "en-GB". Como dice mi compañero, al final, lo verdaderamente interesante (en informática) siempre está en inglés.
Usarlo es tremendamente simple en lo que va siendo una tendencia en Google. Es decir, utilizar sus API vía una llamada a una URL que devuelve algo. En este caso llamamos a una URL con unos parámetros determinados que definen el gráfico a generar, devuelto en forma de imagen. La mejor manera, pues, de utilizarlo es a través de la etiqueta <img src="..." />. En tu editor de texto para las entradas de tu bitácora puedes incluirlos insertando una imagen y en origen (o fuente o URL) indicas la dirección de la API con sus parámetros.
Los gráficos inferiores de pastel o barras representan, ambos, la distribución porcentual de las fuentes de tráfico de este bitácora. La etiqueta que genera ese cada uno de ellos está justo debajo (separo en líneas los parámetros, aunque la URL se debe de indicar de manera continua):
<img src="https://chart.googleapis.com/chart?
cht=p3
&chs=400x100
&chd=t:45.25,37.45,16.36,0.94
&chl=45%|37%|16%|1%
&chdl=Buscadores|Referencia|Directo|Otros"
border="1" />
<img src="https://chart.googleapis.com/chart?
cht=bhs
&chs=400x200
&chd=t:45.25,37.45,16.36,0.94
&chxt=x,y
&chxl=1:|Otros|Directo|Referencia|Buscadores|0:|0%|20%|40%|60%|80%|100%
&chtt=Origen%20Tráfico%20Web|blog.artecar24.com"
border="1" />
Para los bitácoras dedicados a ciencias o matemáticas recomiendo investigar el apartado dirigido a generar fórmulas en formato gráfico. Evitarás tener que editar una imagen, con el engorro que eso supone, en un programa de edición de imágenes para luego subirlo a tu blog, con la ventaja añadida de permitir una rápida edición con sólo modificar los parámetros de la URL. La fórmula se especifica en el parámetro chl y se describe en lenguaje TeX (es aconsejable codificarla para evitar problemas con algunos carácteres).
En el ejemplo, la fórmula de la media aritmética (una apreciación sobre las fórmulas, el signo + hay que indicarlo en formato UNICODE, como %2B):
<img src="https://chart.googleapis.com/chart?
cht=tx
&chs=300x400
&chl=\bar{x} = \frac{x_1 %2B x_2 %2B ... %2B x_n}{n} = \frac{\sum_{i=1}^n x_i}{n}"
border="1" />
Más ejemplos e información útil en:
- Introducción a Google Chart API es una interesante guía paso a paso con interesantes ejemplos, sencillos de entender.
- Google Chart API, generando gráficas, un interesante muestrario que combina la API con código JavaScript para generar gráficos con una presentación más dinámica y causar mayor impacto visual en el lector.
- Google Chart Tools / Image Charts (aka Chart API), documentación oficial, en inglés.
- How to use Google Charts API with 6 examples, seis ejemplos detalladamente explicados, en inglés.
- Google Chart API, examples, una interesante recopilación de ejemplos sencillos, para ver cómo se generan busca la URL de las imágenes.
- LaTeX, by Wen Ying Gao, manual detallado del lenguaje TeX (o LaTeX) en formato PPT.




Comentarios
Publicar un comentario