我有以下代码应该使用 Google Chart API 呈现一个简单的面积图,但我无法让它与 AJAX 调用(Python 后端)一起使用。调用(统计)的返回如下:
[
['2012-09-17',1000,400],
['2012-09-18',1170,460],
['2012-09-19',660,1120],
['2012-09-20',1030,540]
]
我得到的错误是:
Uncaught Error: Argument given to addRows must be either a number or an array
有什么明显是错误的吗?我觉得这是一个 javascript 对象问题,但不知道从哪里开始。谢谢!
下面是 HTML/javascript。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<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', 'Quantity');
data.addColumn('number', 'Sales');
var options = {
title: 'Company Performance',
hAxis: {title: 'Year', titleTextStyle: {color: 'red'}},
legend: {position: 'in'},
};
$.ajax({
type: 'POST',
url: "/loaddata",
success: function(stats) {
var vals = stats;
data.addRows(vals);
var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
chart.draw(data, options);
},
});
}
</script>
</head>
<body>
<div id="chart_div" style="width: 800px; height: 450px;"></div>
</body>
</html>