Grafico com API Google

Exemplo de gráfico

// Carregar a API de visualizacao e os pacotes necessarios. google.load('visualization', '1.0', {'packages':['corechart']});

// Especificar um callback para ser executado quando a API for carregada. google.setOnLoadCallback(desenharGrafico);

/** * Funcao que preenche os dados do grafico */ function desenharGrafico() { // Montar os dados usados pelo grafico var dados = new google.visualization.DataTable(); dados.addColumn('string', 'Quota'); dados.addColumn('number', 'Quantidades'); dados.addRows([ ['Consumo', 100], ['Reserva', 100] ]);

// Configuracoes do grafico var config = { 'title':'Quantidade de Litro por dia', 'width':500, 'height':400 };

// Instanciar o objeto de geracao de graficos de pizza, // informando o elemento HTML onde o grafico sera desenhado. var chart = new google.visualization.PieChart(document.getElementById('area_grafico'));

// Desenhar o grafico (usando os dados e as configuracoes criadas) chart.draw(dados, config); }

Exemplo de gráfico

// Carregar a API de visualizacao e os pacotes necessarios. google.load('visualization', '1.0', {'packages':['corechart']});

// Especificar um callback para ser executado quando a API for carregada. google.setOnLoadCallback(desenharGrafico);

/** * Funcao que preenche os dados do grafico */ function desenharGrafico() { // Montar os dados usados pelo grafico var dados = new google.visualization.DataTable(); dados.addColumn('string', 'Quota'); dados.addColumn('number', 'Quantidades'); dados.addRows([