2016-07-24 10 views
0

私は、mysqlからデータを取得し、codeigniterを使用してハイチャートを作成したいと考えています。ここに私のテーブルはあります:Highcharts、Mysql、およびCodeingniter

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> 

と私は空白の画面を取得します。何が間違っている可能性がありますか?あなたは、コントローラの機能から、ビューに表示する配列としてビューにごjson_encoded配列を渡すべきであるありがとう

答えて

0

私はあなたのコードで新しいプロジェクトを作成し、私は問題を発見:

"データ"を "json"に変更する必要があります。 $ .getJSON( ""、機能(データ){...} に$ .getJSON( ""、関数(JSON){..}

<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(json) {    
      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> 

と、試験データと:

INSERT INTO `tbl_chart` (`PID`, `P_ProjectPreparation`, `P_ConceptualDesign`, `P_Realization`, `P_FinalPreparation`, `P_GoLive`) VALUES ('12', '11', '22', '33', '44', '55'), ('13', '111', '222', '333', '444', '555'), ('14', '1111', '2222', '3333', '4444', '5555'), ('15', '11111', '22222', '33333', '44444', '55555'); 

と、画像:enter image description here

+0

問題が解決は!!どうもありがとうございます – Santi

0

....

ので、あなたは、ビューと一緒にお使いのコントローラ機能から表示するビューを定義します。 ..

$this->render('Index',array('json_array_var_in_view' => $my_json_array)); 

もそれはきっと...我々はYiiの中でそれを行う方法CIで同様の線に沿って何かだ...

上の行は、コントローラのビューがindex.phpファイルであり、それは必要があることを示し変数を保持する$json_array_var_in_view ...

ので、私は何を強調していますことは、あなたのdata関数は、渡された配列を使用してビューを呼び出す必要がある...

関連する問題