2016-05-13 62 views
0

我試圖將數據庫中的數據顯示爲linear highchart。這是從我的控制器json響應是從數據庫中檢索:顯示數據庫中的數據的線性高圖

[{"protocole":"tcp","date":"01/02/20","time":"00:10:20","total":281}, 
{"protocole":"udp","date":"01/02/20","time":"00:10:30","total":201}, 
{"protocole":"tcp","date":"01/02/20","time":"00:10:40","total":100}} 

我成功顯示從數據的基礎上在數據yAxix但我已經與在此xAxix靜態數據測試它是代碼:

$(document).ready(function() { 

    var options={ 
     chart: { 
       renderTo: 'container', 
       type: 'line' 
      }, 
     title : { 
      text: 'Total Request number' 
     }, 
     subtitle : { 
      text: 'Server num1' 
     }, 
     xAxis : { 
      categories: ['00:10:20','00:10:30','00:10:40'] 
     }, 
     yAxis :{ 
      title: { 
      text: 'Total' 
      }, 
      plotLines: [{ 
      value: 0, 
      width: 1, 
      color: '#808080' 
      }] 
     }, 

     tooltip : { 
      valueSuffix: '\xB0C' 
     }, 

     legend : { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'middle', 
      borderWidth: 0 
     }, 

     series : [{}] 

    } 
$.ajax({ 
type: 'GET', 
contentType : 'application/json', 
dataType: 'JSON', 
url: 'jsonsdp', 
data: "", 
success: function(data){ 
    var array=[] ; 
    $.each(data, function(i) { 


     array.push(data[i].total); 

     }) 
     alert(array); 
    options.series[0]= {"name": 'total', 
      "data":array}; 


    var chart = new Highcharts.Chart(options); 

} 
}); 

});  

現在我想要categories是動態的,檢索time並把它放在軸上。 我試過這段代碼,但仍然不工作!

$.ajax({ 
type: 'GET', 
contentType : 'application/json', 
dataType: 'JSON', 
url: 'jsonsdp', 
data: "", 
success: function(data){ 
    var array=[] ; 
    var array1=[]; 
    $.each(data, function(i) { 


     array.push(data[i].total); 
     array1.push(data[i].time); 
     }) 
     // alert(array); 
    options.series[0]= {"name": 'total', 
      "data":array}; 
     options.xAxis.categories=array1; 

    var chart = new Highcharts.Chart(options); 

} 
}); 

有人有一個想法如何做到這一點? 在此先感謝。

+0

你檢查了控制檯嗎?有沒有錯誤?也就在您設置類別之前,您是否嘗試過檢查array1的內容? –

+0

我已經測試了array1的alert.yes它包含數據庫中的時間數組 –

+0

控制檯包含一個錯誤'Uncaught ReferenceError:無效的左側在賦值中'你知道這是什麼意思? –

回答

1

我測試過這段代碼,它完美的工作! 我不知道爲什麼這不是第一次工作,並顯示錯誤,現在工作! 我發佈它也許它可以幫助someOne。如果有人知道爲什麼提起它會更好。

$.ajax({ 
type: 'GET', 
contentType : 'application/json', 
dataType: 'JSON', 
url: 'jsonsdp', 
data: "", 
success: function(data){ 
var array=[] ; 
var array1=[]; 
$.each(data, function(i) { 


    array.push(data[i].total); 
    array1.push(data[i].time); 
    }) 
    // alert(array); 
options.series[0]= {"name": 'total', 
     "data":array}; 
    options.xAxis.categories=array1; 

var chart = new Highcharts.Chart(options); 

} 
});