如何使用for循环动态地将行添加到Google图表

How To dynamically Add row To Google Chart with for loop

本文关键字：添加 Google 图表 何使用 for 循环 动态      更新时间：2023-09-26

>我在谷歌图表中遇到问题。

我正在使用 asp.net MVC。从控制器获取数据后，我将其传递到谷歌图表中。

当我使用手动数据时，例如：

['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'],
['2004/05',  165,      938,         522,             998,           450,      614.6],

它正确地显示我.

但是如何将我的数据动态添加到谷歌图表中？

这是我的代码：

for (var i = 0; i < chartsdata.length; i++) {
    var data = google.visualization.arrayToDataTable([
        ['Element', 'Density', {role: 'style'}],
        [chartsdata[i].MonthValue, chartsdata[i].CountValue, '#b87333']
    ]);
    var options = {
        title: ''
    };
    var chart = new google.visualization.ComboChart(document.getElementById('chartdiv'));
    chart.draw(data, options);
}

你的做法是错误的。您应该执行以下操作：

 var data=[];
 var Header= ['Element', 'Density', { role: 'style' }];
 data.push(Header);
 for (var i = 0; i < chartsdata.length; i++) {
      var temp=[];
      temp.push(chartsdata[i].MonthValue);
      temp.push(chartsdata[i].CountValue);
      data.push(temp);
  }
var chartdata = new google.visualization.arrayToDataTable(data);
您可以使用"

google.visualization.DataTable() "及其" addRow()" 谷歌代码

var data = new google.visualization.DataTable();
data.addColumn('string', 'Month');
data.addColumn('number', 'Count');
for (var i = 0; i < chartsdata.length; i++) {
     data.addRow([chartsdata[i].month, chartsdata[i].count]);
}

为我解决了：

var data=[];
var Header= ['Element', 'Density', { role: 'style' }];
data.push(Header);
for (var i = 0; i < chartsdata.length; i++) {
      var temp=[];
      temp.push(chartsdata[i].MonthValue);
      temp.push(chartsdata[i].CountValue);
      temp.push("red"); //this will change based on value of 'i' variable
      data.push(temp);
  }
var chartdata = new google.visualization.arrayToDataTable(data);
相关文章：