将php变量传递给Google Chart

Question

I have a simple pie chart from official Google Chart gallery page

<script type="text/javascript">
        google.load("visualization", "1", {packages:["corechart"]});
        google.setOnLoadCallback(drawChart);
        function drawChart() {
          var data = google.visualization.arrayToDataTable([
            ['Task', 'Hours per Day'],
            ['Target',    10],
            ['Achieved',      2], 
          ]);

          var options = {
            title: ''
          };

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

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

Now I want to pass it only 2 variables target and achieved . These 2 values are coming from database, how do I pass it to the charts? I can't calculate them before html tag as they are in a loop and generating divs in loop.

Answer 1

You can embed PHP and JavaScript interchangeably.

You have to first fetch data from database.

Then assign it using:

  var data = google.visualization.arrayToDataTable([
            ['Task', 'Hours per Day'],
            ['Target',    '<?php echo $targetFromDatabase;?>'],
            ['Achieved',      '<?php echo $achievedFromDatabase;?>'],
          ]); 

Answer 2

Use code as bellow, do not use ' marks before or end of PHP statement. If you use ' mark it will not work.

var data = google.visualization.arrayToDataTable([
            ['Task', 'Hours per Day'],
            ['Target',    <?php echo $targetFromDatabase;?>],
            ['Achieved',      <?php echo $achievedFromDatabase;?>],
          ]);