如何在點擊事件後繪製google.visualization.datatable？

如何在點擊事件後繪製數據表？我旁邊的js代碼：如何在點擊事件後繪製google.visualization.datatable？

function drawDataTable() { 

var options = {'showRowNumber': true}; 
var query = new google.visualization.Query($('#connection_spreadsheet_url').val()); 


function handleQueryResponse(response) { 
    if (response.isError()) { 
     alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); 
     return; 
    } 
    var data = response.getDataTable(); 
    (new google.visualization.Table($('#table')[0])).draw(data, options); 
} 

function sendAndDraw() { 
    query.send(handleQueryResponse); 
} 

google.setOnLoadCallback(sendAndDraw);

}

它的做工精細，但我想只有在點擊按鈕後，繪圖數據表（例如$（ '＃鍵'））

來源

2014-05-21 MicRum

更換這條線：

google.setOnLoadCallback(sendAndDraw);

像這樣的東西：

google.setOnLoadCallback(function() { 
    $('#button').click(sendAndDraw); 
});

這可確保在嘗試使用任何組件之前加載API。您可能希望最初禁用該按鈕，並在回調運行時啓用該按鈕，因此用戶沒有「我點擊過這個並沒有發生任何事」問題（在API加載速度較慢的情況下）。

來源

2014-05-21 17:59:57 asgallant

非常感謝您！漂亮而簡單的解決方案！ – MicRum

是這樣的嗎？ http://jsfiddle.net/9Rawe/我知道這不是一個數據表，但它應該工作幾乎相同的方式，所有的谷歌可視化

<html> 
    <head> 
     <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
     <script type="text/javascript"> 
      google.load('visualization', '1', { 
       'packages': ['corechart'], 
       "callback": drawChart 
      }); 
      function drawChart() { 
       var data = google.visualization.arrayToDataTable([ 
        ['Year', 'Sales', 'Expenses'], 
        ['2004', 1000, 400], 
        ['2005', 1170, 460], 
        ['2006', 660, 1120], 
        ['2007', 1030, 540] 
       ]); 

       var options = { 
        title: 'Company Performance' 
       }; 

       $("#button").click(function() { 
        var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
        chart.draw(data, options); 
       }); 
      } 
     </script> 
    </head> 
    <body> 
     <input type="submit" value="Display Chart" id="button" /> 
     <div id="chart_div" style="width: 900px; height: 500px;"></div> 
    </body> 
</html>

來源

2014-05-21 18:01:22

如何在點擊事件後繪製google.visualization.datatable？

回答

相關問題