Graphics with PHP Chart.js

Question

Graphics with PHP Chart.js

Navigation

#1 by (0 votes)

2

I am implementing graphics in my application made in PHP, using Framework Chart.js, passing the query data via JSON, to mount the chart, but when I render it it presents the following error:

Followingcode:

$(document).ready(function(){$.ajax({url:"http://des.ead.prodemge.gov.br/gea/develop/graficos/data.php",
        method: "GET",
        success: function(dados) {
        console.log(dados);
        var departament = [];
        var acesso      = [];

        for( var i in dados){
            departament.push("Departamento "+dados[i].department);
            acesso.push(dados[i].qtdacesso);
        }

        var chartdado = {
            labels:departament,
            datasets:[
                {
                    label: 'Departamento Acessos',
                    backgroundColor: 'rgba(200, 200, 200, 0.75)',
                    borderColor:  'rgba(200, 200, 200, 0.75)',
                    hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                    hoverBorderColor: 'rgba(200, 200, 200, 1)',
                    dados:acesso

                }
            ]
        };

        var ctx = $("#mycanvas");
        var grafico = new (ctx, {
            type:'bar',
            data:chartdado
        });
    },
    error: function(dados){
        console.log(dados);
    }
});

});

php javascript jquery chartjs

asked by anonymous 26.10.2017 / 14:49

1 answer

Spring Boot connecting to the Microsoft Sql Server database Selection area with the mouse?

score 0 · Answer 1

I was able to reproduce your error in the following section:

var grafico = new (ctx, {
    type:'bar',
    data:chartdado
});

According to the Chart.js documentation to create a graph you need to instantiate the% object with% of them, logo your code looks like this:

var grafico = new Chart(ctx, {
    type:'bar',
    data:chartdado
});

I made a fiddle with an example working, as I could not access the url Chart I made a mock using url http://des.ead.prodemge.gov.br/gea/develop/graficos/data.php .

Follow the Fiddle: link