2011-12-27 61 views
3

我已經安裝由以下的例子此頁面上一個簡單的谷歌圖: http://code.google.com/apis/chart/interactive/docs/gallery/linechart.html如何另一個數據系列添加到谷歌圖表

google.load("visualization", "1", {packages:["corechart"]}); 
     google.setOnLoadCallback(drawChart); 
     function drawChart() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Year'); 
     data.addColumn('number', 'Sales'); 
     data.addColumn('number', 'Expenses'); 
     data.addRows([ 
     ['2004', 1000, 400], 
     ['2005', 1170, 460], 
     ['2006', 860, 580], 
     ['2007', 1030, 540] 
     ]); 

     var options = { 
      width: 400, height: 240, 
      title: 'Company Performance' 
     }; 

     var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
     chart.draw(data, options); 
     } 

但現在,它的渲染後,與一些JavaScript,我想動態添加另一系列數據。任何人都可以在正確的方向指出我如何做到這一點?
我想添加的數據,與僱員人數的一個數字欄,應該以另一種顏色在圖表中顯示一個新行,並且不在2004年開始,但在2005年,

回答

2

您需要添加將新數據添加到「數據」變量並再次調用chart.draw()方法。 查看數據表文檔或http://code.google.com/apis/ajax/playground/?type=visualization#line_chart

實例玩了一下:

// Add columns 
    data.addColumn('string', 'Employee Name'); 
    data.addColumn('date', 'Start Date'); 

    // Add empty rows 
    data.addRows(6); 
    data.setCell(0, 0, 'Mike'); 
    data.setCell(0, 1, {v:new Date(2008,1,28), f:'February 28, 2008'}); 
    data.setCell(1, 0, 'Bob'); 
    data.setCell(1, 1, new Date(2007, 5, 1)); 
    data.setCell(2, 0, 'Alice'); 
    data.setCell(2, 1, new Date(2006, 7, 16)); 
    data.setCell(3, 0, 'Frank'); 
    data.setCell(3, 1, new Date(2007, 11, 28)); 
    data.setCell(4, 0, 'Floyd'); 
    data.setCell(4, 1, new Date(2005, 3, 13)); 
    data.setCell(5, 0, 'Fritz'); 
    data.setCell(5, 1, new Date(2007, 9, 2)); 
+1

有沒有一種方法來添加新的數據,而不改變原來的數組?上述建議的問題是我首先必須將新數據「合適」到該數組中。我可以這樣做,但默認情況下它並不適合。因此,我的問題.. – Tys 2011-12-28 00:54:14

+0

請參閱DataTable文檔。你有addColum和setCell方法。 addColum添加一個新的serie,並使用setCell你可以填充它。最好是將數據副本保存在一個不同於你使用的庫所需格式的變量中。通過這種方式,您可以將更多數據添加到源數組並再次傳遞到可視庫。 – EricSonaron 2011-12-28 10:17:31

+0

我希望有更靈活的東西,但我現在這樣做了。 – Tys 2011-12-28 21:24:42

相關問題