Google Charts displaying data in wrong order

Asked

Viewed 28 times

1

I am trying to do a Dashboard in a test application that in case would be the amount of each item in each month, with this I do some queries in the backend and pass such information to the front, placing such information in an array, the values of the array are correct, in case we go there!

I have the following code with google Charts:

 <script type="text/javascript">
      google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawChart);
      

      function drawChart() {

        let juntarAgenda = [{{queryAgenda}}]
        let juntarAnotacao = [{{queryAnotacao}}]
        let juntarPresenca = [{{queryPresenca}}]

        var data = google.visualization.arrayToDataTable([
          ['Meses', 'Agendamentos', 'Anotações', 'Presenças'],
          ['Jan', `${juntarAgenda[0]}`, `${juntarAnotacao[0]}`, `${juntarPresenca[0]}`],
          ['Fev', `${juntarAgenda[1]}`, `${juntarAnotacao[1]}`, `${juntarPresenca[1]}`],
          ['Mar', `${juntarAgenda[2]}`, `${juntarAnotacao[2]}`, `${juntarPresenca[2]}`],
          ['Abr', `${juntarAgenda[3]}`, `${juntarAnotacao[3]}`, `${juntarPresenca[3]}`],
          ['Mai', `${juntarAgenda[4]}`, `${juntarAnotacao[4]}`, `${juntarPresenca[4]}`],
          ['Jun', `${juntarAgenda[5]}`, `${juntarAnotacao[5]}`, `${juntarPresenca[5]}`],
          ['Jul', `${juntarAgenda[6]}`, `${juntarAnotacao[6]}`, `${juntarPresenca[6]}`],
          ['Ago', `${juntarAgenda[7]}`, `${juntarAnotacao[7]}`, `${juntarPresenca[7]}`],
          ['Set', `${juntarAgenda[8]}`, `${juntarAnotacao[8]}`, `${juntarPresenca[8]}`],
          ['Out', `${juntarAgenda[9]}`, `${juntarAnotacao[9]}`, `${juntarPresenca[9]}`],
          ['Nov', `${juntarAgenda[10]}`, `${juntarAnotacao[10]}`, `${juntarPresenca[10]}`],
          ['Dez', `${juntarAgenda[11]}`, `${juntarAnotacao[11]}`, `${juntarPresenca[11]}`],
          
        ]);

        var options = {
          chart: {
            title: 'Quantidade de Registros',
            subtitle: 'De hoje há 12 meses atrás',
          },
          vAxis: {format: 'decimal'},
        };

        var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

        chart.draw(data, options);
      }
    </script>

The values contained in the array are:

let juntarAgenda = [0,0,0,0,0,0,0,0,4,0,0,0]
let juntarAnotacao = [0,0,0,0,0,0,0,0,2,0,0,0]
let juntarPresenca = [0,0,0,0,0,0,0,0,0,0,0,0]

In these arrays I pick up with the ${juntarAgenda[9]} (an example) and put such value in the graph, these values are correct when placing the mouse over the column.

That is, the graph is displaying values incorrectly, as if the order is changed, see in the photos how the values came out: inserir a descrição da imagem aqui

Look at the order that’s being displayed, what might be happening? How can I be adjusting?

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.