Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Grafico com dados do servidor

Olá pessoal, estou desenvolvendo uma pequena aplicação financeira e gostaria de colocar alguns graficos nela com o auxilio do Google Chart Tool. Na video-aula 6, foi nos ensinado como carregar um JSON de outro dominio atravez do JSONP. Problema que pelo que entendi o JSON precisa está num padrão para ser carregado na view. No server-side estou usando spring com jackson 2 para gerar o JSON. Minha duvida é: existe alguma forma prática gerar o JSON no formato que o chart Tools entenda ? Vlw pessoal !

3 respostas
solução!

Oi Tiago,

você poderia usar bibliotecas do GWT para isso aí, mas, na minha opinião, é simplesmente mais fácil você criar uma classe que olha pros seus objetos e gera o array de dados que o Chart Tools precisa "na mão". Me refiro ao que é passado como parâmetro do addRows abaixo:

var data = new google.visualization.DataTable();
data.addColumn('string', 'Produto');
data.addColumn('number', 'Quantidade');
data.addRows([
    ['Ioiô', 2],
    ['Pião', 1]
]);

Seria uma classe que você chamaria assim:

List<Produto> produtos = new ArrayList<>();
produtos.add(new Produto("Ioiô", 2));
produtos.add(new Produto("Pião", 1));
String dados = new ConversorChartTools().paraArrayDeDados(produtos);

A vantagem de isolar esse código em uma classe é que, não importa a magia que você vai fazer para gerar esses dados (Reflection, talvez?), tá isolado e é, portanto, testável. :-)

Faz sentido?

Oi Cecilia.

Praticamente fiz o que você sugeriu, fazendo uma classe que implemente. No meu pequeno projeto criei uma classes, basicamente pra formar uma estrutura para quando for gerar o JSON sair como o grafico espera;

mais ou menos assim:

        DataTable dt = new DataTable();
        dt.addColumn("", "Mes", "string");
        dt.addColumn("", "R$", "number");

        dt.insert("Janeiro",200.3);
        dt.insert("Fevereiro",230.3);
        dt.insert("Marco",300.3);
        dt.insert("Abril",500.3);
        dt.insert("Maio",600.3);
        dt.insert("Junho",300.3);

        return dt;

Essa classe DataTable foi a classe que criei pra montar essa estrutura que vi nesse link: https://developers.google.com/chart/interactive/docs/php_example

Ainda to vendo uma forma melhor, tentando seguir as melhores praticas. Apesar de não ter nada demais na implementação, já que é primeiramente só montar a estrutura, o que me "frustou" mais só foi que não tinha nada pronto já que é claro que os dados vão vim do servidor e não diretamente no html.

Mas bom, vou dá uma olhada na tua dica. Muito obrigado pela ajuda Cecilia ;) um abraço.

Caro Tiago, vi que a discussão já está marcada como solucionada, mas como li no último comentário que você ainda pretende procurar uma forma melhor de se fazer a conversão de sql para json, tomei a liberdade de contribuir com uma dica.

Trata-se do link abaixo, onde o autor propõe uma solução para esse problema em PHP:

http://www.agcross.com/2015/01/connecting-a-google-chart-to-a-mysql-database-part-2/

Espero que ajude!

Abraço,

Claudio.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software