Após a vitória do HTML5 na sua batalha contra o Adobe Flash e do funeral do nosso amigo Adobe Flex estive numa constante busca por boas ferramentas para desenvolvimento web, principalmente algo que nos traga a agilidade e produtividade que tínhamos com o Flex. Acredito que nem preciso citar que na atividade de criar gráficos o Flex era um lutador imbatível.
Mesmo com todas suas qualidades, o Flex ainda era dente de leite na categoria web mobile, que foi justamente uma das minhas últimas necessidades. Já a algum tempo tinha engavetado o projeto de criar uma versão mobile para nosso sistema e esta história de HTML5 acabou despertando a chama apagada.
Após comprar os livros “HTML5 – A linguagem de marcação que revolucionou a web” e principalmente “jQuery Mobile” começamos com nosso projeto. A princípio queria um desenvolvimento nativo. Até comecei a estudar o iOS, fiz um curso rápido de Android, mas quando o Windows Phone chegou forte percebi que seria muito trabalho pra uma equipe tão pequena aprender tantas linguagens. Então a decisão foi uma aplicação web, multiplataforma, que poderia atender todas nossas necessidades, visto que nosso sistema é basicamente um dashboard.
Nos surpreendemos com o jQuery Mobile, uma linguagem extremamente simples e poderosa. Sem falar do Codiqa, uma ferramenta fantástica para criar aplicações jQuery mobile com o nosso querido Drag & Drop.
Após definir nossa nova linguagem, veio o principal problema: “Qual componente usaríamos para criar os gráficos?” (aceito sugestões de possíveis componentes). Após um período de pesquisas encontramos alguns componentes gratuitos em javascript mas que possuiam poucas funcionalidades, encontramos alguns pagos porém não tínhamos orçamento para isso, e finalmente chegamos até o bom e velho Google Developers e descobrimos o Google Chart Tools API. Trata-se de uma API executada online que permite criar diversos tipos de gráficos, desde gráficos de Área, Barras, Linhas, até Gauges, Tabelas, Geográficos e Treemap.
Sua utilização é bastante simples. Basta incluir na sua página uma chamada ao arquivo javascript da página do google, criar seu conjunto de dados e executar os métodos correspondentes ao tipo de gráfico desejado, informando em qual div deverá ser criado o componente.
Os gráficos possuem diversas propriedades de customização e a documentação é bastante completa, o que ajuda em muito o trabalho. Porém sem dúvida nenhuma o que mais ajuda no desenvolvimento é o Google Code Playground, onde podemos simular e testar diversos componentes do Google realizando inclusive debug.
Nossa preocupação era apenas que assim como a API do Google Maps, esta também tivesse algum tipo de restrição como por exemplo na quantidade máxima diária de requisições. Porém verifiquei que este limite não existe, entretanto o Google se reserva o direito de bloquear o serviço em caso de uso indevido e abusivo. Bom, esperemos não ter problemas não é mesmo?
Posso afirmar que tem sido muito fácil utilizar estas ferramentas e nosso sistema está ficando ótimo. Já utilizamos gauges, gráficos de linha, área e colunas e até agora não tivemos nenhum problema quanto a desempenho.
Nos próximos post´s explicarei com maiores detalhes como utilizar a API e explicarei algumas customizações que aplicamos para conseguir alguns gráficos mais específicos.
(emilioParme){} 