sexta-feira, 24 de outubro de 2014

HighCharts com Ajax/Codeigniter - Parte01

//Na página HTML
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="chartContainer" style="width:500px; height:500px;"></div>

//No arquivo JavaScript

//variaveis
var chart1;
var timeGrafico;

//chamando a função para atualizar o gráfico
$(function(){
     atualiza_chart();
});

//função para buscar os dados e atualizar as informações do gráfico
function atualiza_chart() {

        $.post(base_url+'vendas/dadosGrafico', {}, function(data) {
           
                var chart1 = new Highcharts.Chart({
                                chart: {
                                    renderTo: 'chartContainer',
                                    type: 'line',
                                },
                                title: {
                                    text: 'Titulo do Gráfico'
                                },
                                xAxis: {
                                    categories: data.categories
                                },
                                yAxis: {
                                    title: {
                                        text: 'Valores'
                                    }
                                },
                                series: data.series_data
            });
                                             
           //grafico se atualiza a cada 1minuto
           timeGrafico = setTimeout(function(){atualiza_chart()}, 60000 );

        }, 'json');

    }

Nenhum comentário:

Postar um comentário