使用傳遞給google.setOnLoadCallback（）的函數中的參數;

Question

我正在嘗試使用Google Visualization API來顯示從MySQL服務器收集的數據。 我想使用PHP獲取數據，然后將其傳遞給javascript函數調用以創建圖表。 當我這樣做時，我在將參數傳遞給傳遞給google.setOnLoadCallback（）;的函數時遇到問題。 我對網絡編程很新，所以請耐心等待。 工作代碼（幾乎來自他們的文檔）看起來像這樣：

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  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.addRows(4);
    data.setValue(0, 0, '2004');
    data.setValue(0, 1, 1000);
    data.setValue(1, 0, '2005');
    data.setValue(1, 1, 1170);
    data.setValue(2, 0, '2006');
    data.setValue(2, 1, 660);
    data.setValue(3, 0, '2007');
    data.setValue(3, 1, 1000);

    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, title: 'Company Performance',
                      hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
                     });
  }
</script>
</head>

<body>
  <div id="chart_div"></div>
</body>
</html>

我試圖首先看看我是否可以在drawChart（）函數之外設置數據並將其作為參數傳遞，如下所示：

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

  var data1 = new google.visualization.DataTable();
    data1.addColumn('string', 'Year');
    data1.addColumn('number', 'Sales');
    data1.addRows(4);
    data1.setValue(0, 0, '2004');
    data1.setValue(0, 1, 1000);
    data1.setValue(1, 0, '2005');
    data1.setValue(1, 1, 1170);
    data1.setValue(2, 0, '2006');
    data1.setValue(2, 1, 660);
    data1.setValue(3, 0, '2007');
    data1.setValue(3, 1, 1000);

  google.setOnLoadCallback(drawChart(data1));

  function drawChart(data) {
    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, title: 'Company Performance',
                      hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
                     });
  }
</script>
</head>

<body>
  <div id="chart_div"></div>
</body>
</html>

我不太清楚為什么這不起作用。 使用來自PHP MySQL調用的動態收集數據創建DataTable對象的最佳方法是什么？ 謝謝你的時間。

Answer 1

在第一個示例中，您將函數傳遞給回調，在第二個示例中，您調用函數，然后將該調用的結果傳遞給回調。

嘗試：

setOnLoadCallback(function(){ drawChart(data) })

Answer 2

以下是使其工作的步驟：

將google.load和google.setOnLoadCallback放在單獨的腳本代碼中。
使用函數表達式。

這是工作代碼：

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(function() { drawChart(data1); });
</script>
<script type="text/javascript">

  var data1 = new google.visualization.DataTable();
    data1.addColumn('string', 'Year');
    data1.addColumn('number', 'Sales');
    data1.addRows(4);
    data1.setValue(0, 0, '2004');
    data1.setValue(0, 1, 1000);
    data1.setValue(1, 0, '2005');
    data1.setValue(1, 1, 1170);
    data1.setValue(2, 0, '2006');
    data1.setValue(2, 1, 660);
    data1.setValue(3, 0, '2007');
    data1.setValue(3, 1, 1000);

  function drawChart(data) {
    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, title: 'Company Performance',
                      hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
                     });
  }
</script>
</head>

<body>
  <div id="chart_div"></div>
</body>
</html>

使用傳遞給google.setOnLoadCallback（）的函數中的參數;

問題描述

2 個解決方案

解決方案1
36 2011-05-09 00:00:14

解決方案2
20 已采納 2012-10-16 09:20:15

使用傳遞給google.setOnLoadCallback（）的函數中的參數;

問題描述

2 個解決方案

解決方案1 36 2011-05-09 00:00:14

解決方案2 20 已采納 2012-10-16 09:20:15

解決方案1
36 2011-05-09 00:00:14

解決方案2
20 已采納 2012-10-16 09:20:15