0

我正在尝试使用 google api 创建 google 图表,它适用于此:

<?php
echo "hi";
$mysqli =mysqli_connect('127.0.0.1:3306', 'root', 'root', 'test');
if (mysqli_connect_errno()) {
    echo "Failed to connect to MySQL: ".mysqli_connect_error();
}
  $result = $mysqli->query('SELECT * FROM new_view');

  $rows = array();
  $table = array();
  $table['cols'] = array(
    array('label' => 'ind_type', 'type' => 'string'),
    array('label' => 'Index_val', '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['ind_type']); 

      // Values of the each slice

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

$table['rows'] = $rows;

// convert data into JSON format
$jsonTable = json_encode($table);
//echo $jsonTable;


?>


<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: 'Index analysis',
          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>

但是现在我尝试将 html 部分放入另一个文件中,将数据库部分放入另一个文件中,如下所示:

ajax_form_temp.php

    <html>
      <head>
        <!--Load the Ajax API-->
            <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
        <meta content="utf-8" http-equiv="encoding" />
        <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() {

        var jsonTable = $.ajax({
            url:"ajax_graph_temp.php",
            dataType:"json",
            async:true
            }).responseText;

          // Create our data table out of JSON data loaded from server.
          var data = new google.visualization.DataTable(jsonTable);
          var options = {
               title: 'Index analysis',
              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>

和 ajax_graph_temp.php

<?php

$mysqli =mysqli_connect('127.0.0.1:3306', 'root', 'root', 'test');
if (mysqli_connect_errno()) {
    echo "Failed to connect to MySQL: ".mysqli_connect_error();
}
  $result = $mysqli->query('SELECT * FROM new_view');

  $rows = array();
  $table = array();
  $table['cols'] = array(
    array('label' => 'ind_type', 'type' => 'string'),
    array('label' => 'Index_val', '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['ind_type']); 

      // Values of the each slice

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

$table['rows'] = $rows;

// convert data into JSON format
$jsonTable = json_encode($table);
echo $jsonTable;
?>

代码是一样的。就在第二种方法中,使用 json 获取表数据。但是在行var data = new google.visualization.DataTable(jsonTable);jsonTable 无法获取列,尽管它存在。

在浏览器中:Table has no column error 来了!列已声明$table['cols'] = array( array('label' => 'ind_type', 'type' => 'string'), array('label' => 'Index_val', 'type' => 'number')

问题出在哪里?

4

1 回答 1

0

这不能回答您的问题,但这是您可以做到的一种方法。

首先,通过从版本控制中再次检出来恢复工作版本。

然后对您检查的工作代码进行少量编辑 - 每次编辑后 - 代码仍然有效

在这些小编辑中,您首先将部分代码移动到函数定义中,然后(如果仍然有效)将这些函数定义移动到您包含的新文件中。

在每次小的编辑之后进行一次提交,以便您可以细粒度地退后一步或进行比较,以查看您在哪些代码行中准确地引入了错误。

通过创建函数并将它们部分移出,您可以轻松地做您想做的事情。一次性全部做会引入很多错误,不利于快速复习。

希望这有帮助。

另见:

于 2013-07-16T07:16:03.200 回答