Javascript Google Charts更改数据

Question

我正在尝试创建一个功能来更改Google Charts散点图中的数据，但是当我调用该函数时，图表不会更改。 下面是代码：

<script type="text/javascript">

var years = [2001, 2002, 2003, 2004, 2005];
var sales = [1, 2, 3, 4, 5];

google.load("visualization", "1", {packages:["corechart"]});

 google.setOnLoadCallback(drawChart);

  var data;
  var options;
  var chart;

  function drawChart() {
        data = new google.visualization.DataTable();
  data.addColumn('number', 'years');
  data.addColumn('number', 'sales');

  for(i = 0; i < years.length; i++)
    data.addRow([years[i], sales[i]]);

        options = {
          title: 'Age vs. Weight comparison',
          hAxis: {title: 'Age', minValue: 0, maxValue: 1},
          vAxis: {title: 'Weight', minValue: 0, maxValue: 1},
          legend: 'none'
        };

        chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));

        chart.draw(data, options);
      }

    $(document).ready(function(){
         changeData();
    });

     function changeData()
     {
        data.addRow(10, 10);
        chart.draw(data, options); 
     }   
</script>

Answer 1

代码中有一些错误。

第一个：你正在调用load google.setOnLoadCallback(drawChart); 还有changeData(); 似乎首先启动了changeData()因为报告了错误：

Uncaught TypeError: Cannot call method 'addRow' of undefined

修复它的一个选择是调用changeData(); 在drawChart()函数的末尾。

下一个：打电话

data.addRow(10, 10);

必须改为：

data.addRow([2006, 10]);

因为addRow()需要一个数组。

并且必须更改最小值和最大值。

请参阅jsbin上的示例 。