Highcharts，Mysql和Codeigniter

Question

我想制作从mysql获取数据并使用codeigniter的高级图表。这是我的表：

CREATE TABLE tbl_chart (
PID varchar (10), P_ProjectPreparation int, P_ConceptualDesign int, P_Realization int, P_FinalPreparation int, P_GoLive );

列PID将是xAxis，另一列将是系列。这是我的控制器：

<?php defined('BASEPATH') OR exit('No direct script access allowed'); 
class admin_c extends CI_Controller {
 public function __construct()
    {
        parent::__construct();

        $this->load->database();
        $this->load->helper('url');
        $this->load->model('chartmanage_m');
    }

public function index()
{
$this->load->view('admin_v');
}

public function data()
{

$data = $this->chartmanage_m->get_data();

$category = array();
$category['name'] = 'PID';

$series1 = array();
$series1['name'] = 'Project Preparation';

$series2 = array();
$series2['name'] = 'Conceptual Design';

$series3 = array();
$series3['name'] = 'Realization';

$series4 = array();
$series4['name'] = 'Final Preparation';

$series5 = array();
$series5['name'] = 'Go Live';

foreach ($data as $row)
{
$category['data'][] = $row->PID;
$series1['data'][] = $row->P_ProjectPreparation;
$series2['data'][] = $row->P_ConceptualDesign;
$series3['data'][] = $row->P_Realization;
$series4['data'][] = $row->P_FinalPreparation;
$series5['data'][] = $row->P_GoLive;
}

$result = array();
array_push($result,$category);
array_push($result,$series1);
array_push($result,$series2);
array_push($result,$series3);
array_push($result,$series4);
array_push($result,$series5);

print json_encode($result, JSON_NUMERIC_CHECK);
}}

这是我的模型：

<?php defined('BASEPATH') OR exit('No direct script access allowed');
class chartmanage_m extends CI_Model { function __construct() { 

parent::__construct(); }
function get_data()
{
$this->db->select('*');
$this->db->from('tbl_chart'

);
$query = $this->db->get();
return $query->result();
}

这是我的观点：

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
 <script type="text/javascript">
  $(document).ready(function() {
        var options = {
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 25
            },
            title: {
                text: 'Project Requests',
                x: -20 //center
            },
            subtitle: {
                text: '',
                x: -20
            },
            xAxis: {
                categories: []
            },
            yAxis: {
                title: {
                    text: 'Requests'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: function() {
                        return '<b>'+ this.series.name +'</b>'+
                        this.x +': '+ this.y;
                }
            },


            series: []
        }

        $.getJSON("<?php echo site_url('admin_c/data');?>", function(data) {
        options.xAxis.categories = json[0]['data'];
            options.series[0] = json[1];
            options.series[1] = json[2];
            options.series[2] = json[3];
            options.series[3] = json[4];
            options.series[4] = json[5];
            chart = new Highcharts.Chart(options);
        });
    });
 </script>

我得到了空白屏幕。

Answer 1

另一答案