Páginas

quinta-feira, 28 de fevereiro de 2013

Gráficos dinâmicos com Google Charts


O Google possui um serviço muito interessante de geração de charts a partir de URLs. Vamos analisar esse serviço, os parâmetros necessários e os tipos de gráficos que ele disponibiliza.


Veja a imagem acima. Esse gráfico é gerado em tempo real ao acessar a url:
https://chart.googleapis.com/chart?cht=p&chs=500x250&chd=t:60,30,10&chl=PHP|JAVA|ASP

O Google interpreta esses parâmetros contidos na url para renderizar o gráfico desejado. Vamos analisar os parâmetros:

Parâmetro cht: Refere-se ao tipo do chart a ser gerado. No exemplo acima eu usei o 'p' de pizza. Outros tipos são os abaixo:

cht=p3: Pizza 3d


cht=bvs: Barras Verticais

                                                                   

cht=gom: Velocímetro


cht=lc: Linha


cht=r: Radar

                                       

cht=rs: Radar com linhas curvas

                                     
cht=v: Círculos


Parâmetro chs: Refere-se ao tamanho do gráfico em duas dimensões (chs=LARGURAxALTURA) Ex. chs=500X250

Parâmetro chd: Aqui teremos os valores do chart. Na url está definido assim: chd=t:60,30,10. Isso quer dizer que o primeiro elemento tem valor 60, o segundo 30 e o terceiro 10.

Parâmetro chl: Trata-se do label dos valores definidos no parâmetro anterior, separados por '|'. Na url está definido assim: chl=PHP|JAVA|ASP. Perceba que devem vir na ordem do parâmetro anterior, ou seja, nesse caso PHP terá valor 60 (pois ambos estão na primeira posição), JAVA tem valor 30 (segunda posição) e ASP valor 10 (terceira posição).

É claro que, visto se tratar de uma URL, podemos modificar esses valores e labels em tempo de execução via programação colocando, por exemplo, dados diretamente do banco de dados. Assim teremos uma forma fácil e prática de implantar rapidamente gráficos em nossos sistemas.

Vários sites importantes usam esse serviço, por exemplo o Baixaki. Veja abaixo:


Acesse o baixaki e selecione algum programa para baixar, clique com o botão direito do mouse em cima do gráfico para extrair a URL da imagem e verá que o baixaki usa o serviço do google charts.

Fica a dica.

Atenciosamente,
Gustavo Marques

Nenhum comentário:

Postar um comentário

Veja também

Related Posts Plugin for WordPress, Blogger...