Google Charts with php

Question

I’m developing an application where each user will receive different types of data through google Harts, however I can’t make the data appear on the screen. Follow the javascript code snippet:

<script type="text/javascript">


        google.charts.load('current', {packages: ['corechart']});
        google.charts.setOnLoadCallback(drawChart);

        function drawChart() {

            // Create the data table.
            var data = new google.visualization.arrayToDataTable([
                [{label: 'Status', type: 'string'},
                 {label: 'Quantidade', type: 'number'}
                ],

                <?php
                    foreach ($_SESSION["data_grafico1"] as $dados){
                        echo "['$dados[0]', $dados[1]]";
                    }
                ?>
                ]);



            // Set chart options
            var options = {'title':'Quantidade de protocolos por Status',
                'width':400,
                'height':300};

            // Instantiate and draw our chart, passing in some options.
            var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
            chart.draw(data, options);
        }

    </script>

The information contained in the $data variable is the indexes (string), represented by $data[0] and the numerical values contained in $data[1] respectively. Can anyone help me with this question? The information in $data[0] and $data[1] is recovered normally, however when adding in js are not displayed. I appreciate the help beforehand.

Answer 1

It is necessary to create a array with the data of foreach but the key 0 must be the title of the axes.

$array_list[]="['Status','Quantidade']"; //setting the axle title

Now create the foreach and feed the array_list with the data

<?php
foreach ($_SESSION["data_grafico1"] as $dados){
    $array_list[]= "['$dados[0]', $dados[1]]";
}
?>

Created the $array now just insert it into the chart.

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

    function drawChart() {

    var data = google.visualization.arrayToDataTable([
      <?php echo (implode(",", $array_list)); ?> //inserindo o array_list
    ]);

    var options = {
      title: 'Quantidade de protocolos por Status'
    };

    var chart = new google.visualization.PieChart(document.getElementById('piechart'));

    chart.draw(data, options);
  }

This way the chart will be created inside the div with the id defined within the JS