饼图使用PHP和MySql

时间:2016-08-05 10:32:45

标签: php mysql pie-chart google-pie-chart

我正在尝试使用我的数据库绘制Pie Chart。我使用了Google Pie ChartPHPMySql。 我运行代码没有显示任何错误,但我没有看到饼图出现。 请有人告诉我在哪里修改使它工作? 感谢。

    <?php
    /* Your Database Name */
$dbname = 'chart';
$username = 'root';
$password = '';

try {
  /* Establish the database connection */
  $conn = new PDO("mysql:host=localhost;dbname=$dbname", $username, $password);
  $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

  /* select all the weekly tasks from the table googlechart */
  $result = $conn->query('SELECT Nature, concat((count( * ) *100 / (SELECT count( * ) FROM `tfichiers`)) , "%") AS percent FROM `tfichiers` GROUP BY Nature ');
  $rows = array();
  $table = array();
  $table['cols'] = array(

    // Labels for your chart, these represent the column titles.
    /* 
        note that one column is in "string" format and another one is in "number" format 
        as pie chart only required "numbers" for calculating percentage 
        and string will be used for Slice title
    */

    array('label' => 'Nature', 'type' => 'string'),
    array('label' => 'percent', 'type' => 'number')

);
    /* Extract the information from $result */
    foreach($result as $r) {

      $temp = array();

      // the following line will be used to slice the Pie chart

      $temp[] = array('v' => (string) $r['Nature']); 

      // Values of each slice

      $temp[] = array('v' => (int) $r['percent']); 
      $rows[] = array('c' => $temp);
    }

$table['rows'] = $rows;

// convert data into JSON format
$jsonTable = json_encode($table);
//echo $jsonTable;
} catch(PDOException $e) {
    echo 'ERROR: ' . $e->getMessage();
}
 ?>
<html>
  <head>
    <!--Load the Ajax API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript">

    // Load the Visualization API and the piechart package.
    google.load('visualization', '1', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.
    google.setOnLoadCallback(drawChart);

    function drawChart() {

      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(<?=$jsonTable?>);
      var options = {
           title: 'Demande par Nature',
          is3D: 'true',
          width: 800,
          height: 600
        };
      // Instantiate and draw our chart, passing in some options.
      // Do not forget to check your div ID
      var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
    </script>
  </head>

  <body>
    <!--this is the div that will hold the pie chart-->
    <div id="chart_div"></div>
  </body>
</html>

0 个答案:

没有答案