2011-10-25 152 views
2

我有以下代碼繪製燭臺可視化。但可視化不會生成。我無法使用錯誤控制檯跟蹤錯誤!Google可視化無法正常工作?

<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
    google.load('visualization', '1', {packages: ['corechart']}); 

function drawVisualization() { 
    // Populate the data table. 
    var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Date'); 
     data.addColumn('number'); 
     data.addColumn('number'); 
     data.addColumn('number'); 
     data.addColumn('number'); 
     data.setValue(0, 0,'Mon'); 
     data.setValue(0, 1, '2'); 
     data.setValue(0,2,'6'); 
     data.setValue(0,3,'8'); 
     data.setValue(0,4,'10'); 
     data.setValue(1, 0,'Mon'); 
     data.setValue(1, 1, '2'); 
     data.setValue(1,2,'6'); 
     data.setValue(1,3,'8'); 
     data.setValue(1,4,'10'); 
    // Draw the chart. 
    var chart = new google.visualization.CandlestickChart(document.getElementById('visualization')); 
    chart.draw(data, {legend:'none', width:600, height:400}); 
    } 

google.setOnLoadCallback(drawVisualization); 
    </script> 

任何幫助非常感謝! 謝謝!

回答

2

兩個問題:

1 - 在嘗試設置它們的值之前,需要向表中添加行。

2 - 爲索引1,2,3和4的值必須是數字,而不是因爲列1,2,3,4字符串是數字類型

... 
    // Populate the data table. 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Date'); 
    data.addColumn('number'); 
    data.addColumn('number'); 
    data.addColumn('number'); 
    data.addColumn('number'); 
    //Add new rows first 
    data.addRow(); 
    data.addRow(); 
    data.setValue(0, 0, 'Mon'); 
    data.setValue(0, 1, 2); 
    data.setValue(0, 2, 6); 
    data.setValue(0, 3, 8); 
    data.setValue(0, 4, 10); 
    data.setValue(1, 0, 'Mon'); 
    data.setValue(1, 1, 2); 
    data.setValue(1, 2, 6); 
    data.setValue(1, 3, 8); 
    data.setValue(1, 4, 10); 
    // Draw the chart. 
... 

這裏是一個工作示例

http://jsfiddle.net/WcKFf/2/

+0

謝謝:) :) :) – NeoStar