在传递给 google.setOnLoadCallback() 的函数中使用参数；
Posted
技术标签:
【中文标题】在传递给 google.setOnLoadCallback() 的函数中使用参数；【英文标题】：Use parameter in function passed to google.setOnLoadCallback(); 【发布时间】：2011-08-21 05:54:11 【问题描述】：我正在尝试使用 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 对象的最佳方法是什么？感谢您的宝贵时间。
【问题讨论】：
【参考方案1】：以下是使其工作的步骤：
-
将 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>
【讨论】：
我们不需要单独的脚本标签。它在单个标签中工作正常【参考方案2】：在第一个示例中，您将函数传递给回调，在第二个示例中，您调用该函数，然后将该调用的结果传递给回调。
尝试：
setOnLoadCallback(function() drawChart(data) )
【讨论】：
我这样做并使用虚拟变量进行了测试，成功通过了它们。但是由于某种原因，当我尝试在函数之外创建 DataTable 并将其作为参数传递时，它不喜欢它。以上是关于在传递给 google.setOnLoadCallback() 的函数中使用参数；的主要内容，如果未能解决你的问题，请参考以下文章
作为通用指针类型传递的 SmartPointers 是不是需要在传递给另一个函数之前被释放？