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

Question

I'm trying to display a simple chart but it's not showing on localhost. 我正在尝试显示一个简单的图表，但未在localhost上显示。 I'm using codeigniter framework+google charts. 我正在使用Codeigniter Framework + Google图表。

I want to display this simple chart: Chart 我想显示这个简单的图表：图表

Data_model.php : 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 (controller): 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 (view): 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>

I'm trying to display data from this MySQL table: Mysql table 我正在尝试显示以下MySQL表中的数据： Mysql表

When I try to access it from my localhost chart is not being displayed. 当我尝试从本地主机图表访问它时，未显示。 This is how it looks: Image 外观如下：图片

So what is the problem? 那是什么问题呢？

Answer 1

you can check the browser's console for errors (press F12 on most) 您可以检查浏览器的控制台是否有错误（大多数情况下按F12键）

there are a couple issues here... 这里有几个问题...

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

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

first, there is a ending curly brace out of place after --> 'counts'} 首先，在-> 'counts'}之后有一个结束的花括号
remove it... 去掉它...

next, the array for the data doesn't have ending braces --> ]); 接下来，数据数组没有大括号-> ]);

change above to... 更改为...

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

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

Answer 2

First you have syntax problems, you have a closing bracket in ['pohlavie', 'counts' } ], which doesn't even open or has any porpouse I think. 首先，您有语法问题，在['pohlavie'，'counts' } ]中有一个右括号，我认为它甚至没有打开或有任何海豚。

Then when you have the data, in which you never close the tags from the function: 然后，当您拥有数据时，就永远不会关闭该函数中的标记：

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

I went on https://developers.google.com/chart/interactive/docs/drawing_charts and found out you should probably be using the following first example. 我进入https://developers.google.com/chart/interactive/docs/drawing_charts ，发现您可能应该使用以下第一个示例。 In your case it should go along the lines of the following instead of your var data : 在您的情况下，它应遵循以下内容而不是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"].'"]';
    }
?>
]);

Just to be sure you should check the examples of the google charts documentation. 只是为了确保您应该查看Google图表文档的示例。

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

问题描述

2 个解决方案

解决方案1
0 已采纳 2019-05-02 11:06:23

解决方案2
0 2019-05-02 11:06:51

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

问题描述

2 个解决方案

解决方案1 0 已采纳 2019-05-02 11:06:23

解决方案2 0 2019-05-02 11:06:51

解决方案1
0 已采纳 2019-05-02 11:06:23

解决方案2
0 2019-05-02 11:06:51