Problem selecting month with Chart.js

Question

Hello, I’m having a problem, maybe I’m not doing it properly, but, come on!

I use a chart with Chart.js, I managed to bring the sql data of the desired month normally, it is communicating and pulling the data I want.

My problem is this, I need to make this data appear in the correct month, I have the Abels with the months and I need each month to receive its value. In this case, I’m getting the data of the month 04, but I can’t make this data appear on the label "Abr"...

Follows the code:

            <canvas class="line-chart"></canvas>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>

    <script>
        $('document').ready(function () {

    $.ajax({
        type: "POST",
        url: "chart.php",
        dataType: "json",
        success: function (data) {

            // for (var i in data) {
            //     console.log(data[i].vendas)
            // }
            var nomearray = [];
            var idarray = [];
            for (var i = 0; i < data.length; i++) {

                nomearray.push(data[i].data_vistoria);
                idarray.push(data[i].cpf);


            }

            grafico(nomearray,idarray);

        }
    });

})



    </script>

        <script>
        function grafico(cpf,data_vistoria) {
          var ctx = document.getElementsByClassName("line-chart");

          // Type, Data e o options
          var chartGraph = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ["Jan","Fev","Mar","Abr","Mai","Jun","Jul","Ago","Set","Out","Nov","Dez"],
                datasets:[
              {
                    label:"TAXA DE VISTORIAS - 2019",
                    data: data_vistoria,
                    borderWidth: 1,
                    borderColor: '69baf0',
                    backgroundColor:'rgba(105,186,240,0.55)',

               },

                ]
            },
            options: {
                title: {
                    display:true,
                    fontSite:29,
                    text:"RELATÓRIO DE VISTORIAS ANUAL"
                },
                labels: {
                    fontStyle: "bold"
                }
            }

          });


        } 

        </script>

Here follows the code of the file that communicates with the database and the query I am currently using:

<?php

$pdo = new PDO('mysql:host=localhost;dbname=mkwebd86_sistema;port=3306;charset=utf8', 'mkwebd86_mkpdf', 'Enigma123');

$sql = "SELECT COUNT(*) AS cpf FROM clientes WHERE MONTH(data_vistoria) = '4'";

$statement = $pdo->prepare($sql);

$statement->execute();


while($results = $statement->fetch(PDO::FETCH_ASSOC)) {

    $result[] = $results;
}

echo json_encode($result);

Thanks in advance!

Answer 1

Remove the filter to pull only month 4 and let it pull normal. The way your code is done it’s returning only one result, but despite being the COUNT of month 4, it’s filling in the first label, which is January, since it pulls only one...