Question

我正在尝试显示一个简单的图表，但未在本地主机上显示。我正在使用Codeigniter Framework + Google图表。

我想显示这个简单的图表：Chart

Data_model.php：

defined('BASEPATH') OR exit('No direct script access allowed');


class Data_model extends CI_Model {

private $performance = 'sportoviska_zakaznici';

function __construct() {

}

function get_chart_data() {


   return $this->db->query('SELECT pohlavie, count(*) as counts FROM sportoviska_zakaznici GROUP BY rok')->result_array();
}

}

Charts.php（控制器）：

class Charts extends CI_Controller {


function __Construct() {
    parent::__Construct();

    $this->load->helper(array('form', 'url'));
       $this->load->model('data_model', 'chart');

}

public function index()
{

            $data['chart_data'] = $this->chart->get_chart_data();

    $this->load->view('uvodna_stranka', $data);
}


}

uvodna_stranka.php（视图）：

<!DOCTYPE html>
<html>
    <head>
      <meta charset="UTF-8"/>
        <title></title>
        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
        <script type="text/javascript">



            // Load the Visualization API and the line package.
           // google.charts.load('current', {'packages':['bar', 'timeline']});
             google.charts.load('current', {'packages':['corechart']});
            // Set a callback to run when the Google Visualization API is loaded.
            google.charts.setOnLoadCallback(drawChart);

            function drawChart() {

              var data = google.visualization.arrayToDataTable([
                    ['pohlavie', 'counts'}],
<?php
foreach ($chart_data as $data) {
    echo "['".$data["pohlavie"]."', ".$data["counts"]."],";
}
?>  
               var options = {

                        title: 'Company Performance'

                };

     var chart = new google.visualization.PieChart(document.getElementById('piechart'));
      chart.draw(data, options);

            }

       </script>

    </head>
    <body>
       <b>Bla bla<b>
            <div id="piechart" style="width: 900px;"></div>
</body>
</html>

我正在尝试显示此MySQL表中的数据： Mysql table

当我尝试从本地主机图表访问它时，未显示。外观如下：Image

那是什么问题？

Answer 1

您可以检查浏览器的控制台是否有错误（大多数情况下请按F12键）

这里有几个问题...

var data = google.visualization.arrayToDataTable([
      ['pohlavie', 'counts'}],

<?php
foreach ($chart_data as $data) {
    echo "['".$data["pohlavie"]."', ".$data["counts"]."],";
}
?>

首先，在-> 'counts'}
之后有一个结束的花括号删除...

接下来，数据数组没有大括号-> ]);

更改为...

var data = google.visualization.arrayToDataTable([
      ['pohlavie', 'counts'],

      <?php
      foreach ($chart_data as $data) {
          echo "['".$data["pohlavie"]."', ".$data["counts"]."],";
      }
      ?>  
    ]);

Answer 2

首先，您遇到语法问题，在 ['pohlavie'，'counts'} ] 中有一个右括号，甚至没有打开或有海豚我想。

然后，当您拥有数据时，就永远不会关闭该功能中的标记：

var data = google.visualization.arrayToDataTable([
                ['pohlavie', 'counts'}],
<?php
foreach ($chart_data as $data) {
 echo "['".$data["pohlavie"]."', ".$data["counts"]."],";
}

我继续https://developers.google.com/chart/interactive/docs/drawing_charts，发现您可能应该使用以下第一个示例。就您而言，它应遵循以下内容，而不是您的 var数据：

data = new google.visualization.DataTable();
data.addColumn('string', 'pohlavie');
data.addColumn('number', 'counts');
data.addRows([
<?php 
    foreach ($chart_data as $data) {
        echo '["'.$data["pohlavie"].'","'.$data["counts"].'"]';
    }
?>
]);

请确保您应该查看google图表文档的示例。

图表未显示（Google图表+ Codeigniter）

2 个答案: