2015-04-02 122 views
0

我想動態地爲谷歌線圖創建一個數組,然後我試圖將它傳遞給一個函數,繪製圖表的方式每次我的ajax調用執行它將調用繪製腳本並重新繪製圖表。從ajax請求動態谷歌圖表

在控制檯中的錯誤是:

Uncaught Error: Row 0 has 0 columns, but must have 2format+en,default+en,ui+en,corechart+en.I.js:188 ehaformat+en,default+en,ui+en,corechart+en.I.js:189 Vgaindex.html:115 drawChart 

我不明白爲什麼它說0和0

 var computer_free_memory =[]; 
     function updateComputerdata() { 
      var computer_free_memory =[]; 
      var jqxhr = $.getJSON("http://10.0.0.6:3000/computer_stats?order=time.asc", function() { 
      }) 
      .done(function(data) { 
      var html_insert = '' 
      var stats = '' 
       $.each(data, function(i, item) { 
       html_insert = 'Computer Name:' + item.computer_name + '<br>Operating System:' + item.operating_system + '<br>CPU Model: ' + item.cpu_model + '<br>Cores Assigned: ' + item.cores + '<br>Total Memory: ' + item.total_memory; 
       }); 
       $.each(data, function(i, item) { 
       stats = 'Free Memory:' + item.free_memory 
       var time = new Date(parseInt(item.time)) 
       computer_free_memory.push([time,parseInt(item.free_memory)]); 
       }); 
      console.log(computer_free_memory); 
      memory_chart(computer_free_memory); 
      document.getElementById("computer_info").innerHTML = html_insert; 
      document.getElementById("computer_stats").innerHTML = stats; 
      }) 
      .fail(function() { 
      }) 
      .always(function() { 
      }); 
      setTimeout(function(){ updateComputerdata(); }, 30000); 
     } 
     updateComputerdata(); 

    function memory_chart(computer_free_memory){ 
     google.setOnLoadCallback(drawChart); 

      function drawChart() { 
      var data = google.visualization.arrayToDataTable([ 
       ['Time', 'Free Memory'], 
       computer_free_memory 
      ]); 

      var options = { 
       title: 'Company Performance', 
       curveType: 'function', 
       legend: { position: 'bottom' } 
      }; 

      var chart = new google.visualization.LineChart(document.getElementById('curve_chart')); 

      chart.draw(data, options); 
      } 
    } 

控制檯登錄:

[Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2]…][0 … 99]0: 
Array[2] 
0: Sat Jan 17 1970 05:37:26 GMT-0700 (Mountain Standard Time) 
1: 2818308 
length: 2 
__proto__: Array[0]1: Array[2]2: Array[2]3: Array[2]4: Array[2]5: Array[2]6: Array[2]7: Array[2]8: Array[2]9: Array[2]10: Array[2]11: Array[2]12: Array[2]13: Array[2]14: Array[2]15: Array[2]16: Array[2]17: Array[2]18: Array[2]19: Array[2]20: Array[2]21: Array[2]22: Array[2]23: Array[2]24: Array[2]25: Array[2]26: Array[2]27: Array[2]28: Array[2]29: Array[2]30: Array[2]31: Array[2]32: Array[2]33: Array[2]34: Array[2]35: Array[2]36: Array[2]37: Array[2]38: Array[2]39: Array[2]40: Array[2]41: Array[2]42: Array[2]43: Array[2]44: Array[2]45: Array[2]46: Array[2]47: Array[2]48: Array[2]49: Array[2]50: Array[2]51: Array[2]52: Array[2]53: Array[2]54: Array[2]55: Array[2]56: Array[2]57: Array[2]58: Array[2]59: Array[2]60: Array[2]61: Array[2]62: Array[2]63: Array[2]64: Array[2]65: Array[2]66: Array[2]67: Array[2]68: Array[2]69: Array[2]70: Array[2]71: Array[2]72: Array[2]73: Array[2]74: Array[2]75: Array[2]76: Array[2]77: Array[2]78: Array[2]79: Array[2]80: Array[2]81: Array[2]82: Array[2]83: Array[2]84: Array[2]85: Array[2]86: Array[2]87: Array[2]88: Array[2]89: Array[2]90: Array[2]91: Array[2]92: Array[2]93: Array[2]94: Array[2]95: Array[2]96: Array[2]97: Array[2]98: Array[2]99: Array[2][100 … 199][200 … 299][300 … 399][400 … 499][500 … 599][600 … 699][700 … 799][800 … 899][900 … 974]length: 975__proto__: Array[0] 
format+en,default+en,ui+en,corechart+en.I.js:188 Uncaught Error: Row 0 has 0 columns, but must have 2 

回答

0

的預計爲google.visualization.arrayToDataTable的結構如下所示:

[ 
    [col1Inf, col2Info], 
    [row1Col1, row1Col2], 
    [row2Col1, row2Col2], 
    [row3Col1, row3Col2], 
    // ... 
] 

computer_free_memory,因爲它被傳遞到memory_chart看起來是這樣的:

[ 
    [row1Col1, row1Col2], 
    [row2Col1, row2Col2], 
    [row3Col1, row3Col2], 
    // ... 
] 

您正試圖['Time', 'Free Memory'],computer_free_memory結合,但你正在做的方式導致這(錯誤)結構:

[ 
    ['Time', 'Free Memory'], 
    [ 
     [row1Col1, row1Col2], 
     [row2Col1, row2Col2], 
     [row3Col1, row3Col2], 
     // ... 
    ] 
] 

嘗試這樣的是memory_chart

var rawData = computer_free_memory.slice(); 
rawData.unshift(['Time', 'Free Memory']); 
var data = google.visualization.arrayToDataTable(rawData);