1

我有以下代码应该使用 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>
4

1 回答 1

1

我只能建议您按照与此 Google 示例中相同的方式执行此操作,将 Python 脚本中的整个 JSON 数据直接归因于 Javascript 变量:

var jsonData = $.ajax({
                    url: "/loaddata",
                    dataType:"json",
                    async: false
               }).responseText;
于 2012-12-18T19:11:21.847 回答