javascript - 为谷歌图表创建数据数组

Question

我正在使用谷歌图表，我想创建一个带有数据数组的简单条形图。如果我像这样手动写出数据数组，则图表工作正常:

 var data = [['Municipality', 'CWR', {role: 'style'}],
                  ['Kleinharras', 4.15,'color: #e5e4e2'],
                  ['Stillfried', 4.87,'color: #e5e4e2'],
                  ['Grub an der March', 4.95,'color: #e5e4e2'],
                  ['Großschweinbarth', 3.92,'color: #e5e4e2'],];  

  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
  var data = google.visualization.arrayToDataTable(data);

  var options = {
      title: 'Crop Water Requirement [mm]',
      vAxis: {title: 'Municipality',  titleTextStyle: {color: 'black'}}
    };

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

    chart.draw(data, options);
  }

但是，如果我想用循环自动创建数据数组，它不起作用并且图表不显示:

 var data = [['Municipality', 'CWR', {role: 'style'}]];
         for (i = 0; i < valuesx.length; i++) {
                data[i + 1] = [valuesx[i], valuesy[i], 'color: #e5e4e2'];  
         }

如果我打印出两个数组，它们看起来相同，但是由于某种原因，谷歌图表不接受第二个数据数组。有什么建议吗？

Answer 1

我让它工作了，但我真的不知道为什么它一开始就不起作用。 使用循环构造数组后(参见上面的代码)，我执行以下操作:

var data = google.visualization.arrayToDataTable(data);

如您所见，我正在从数组中创建一个名为 data 的新变量，该变量也称为 data。这就是错误发生的地方。

如果我只是重命名我的数据数组，即重命名为 data2，如下所示:

var data2 = [['Municipality', 'CWR', {role: 'style'}]];
             for (i = 0; i < valuesx.length; i++) {
                    data2[i + 1] = [valuesx[i], valuesy[i], 'color: #e5e4e2'];  
             }

并运行此命令:

  var data = google.visualization.arrayToDataTable(data2);

图表终于显示了。