javascript - 在 Google 图表中动态加载行和列

Question

我试图在从用户那里获取列和行时动态添加它们。到目前为止，我正在测试它，例如:

            var data = new google.visualization.DataTable();

            seriesName[0] = 'Name';
            seriesName[1] = 'Age';

            for (var i = 0; i < seriesName.length; i++) {
                data.addColumn('string', seriesName[i]);
            }

            seriesData[0] = '1, 2, 3, 4, 5';
            for (var i = 0; i < seriesData.length; i++) {
                if (seriesData[i] != null) {
                    var sData = new Array();
                    sData = seriesData[i].split(',');
                    /*for (a in sData) {
                        sData[a] = parseInt(sData[a], 10);
                    }*/
                }
                var data = JSON.parse('[' + sData + ']');
                alert(data);
                data.addRows(data);
            }

            alert(sData);


            var table = new google.visualization.Table(document.getElementById(div.id));
            table.draw(data, { showRowNumber: true });

这可以很好地添加列，但不能添加行。我尝试按以下方式添加行，其工作原理如下:

var rows = new Array();
rows[0] = ['1','2'];
rows[1] = ['abc', 'cdf'];
data.addRows(rows);

现在的问题是我将以逗号分隔的字符串形式获取行，例如“abc，cdf”“1,2”。我尝试使用 .split 方法将此字符串转换为其接受的字符串数组类型，但它似乎不起作用。 Kindle告诉我一种让它发挥作用的方法。谢谢

Answer 1

问题出在这个循环中:

for (var i = 0; i < seriesData.length; i++) {
    if (seriesData[i] != null) {
        var sData = new Array();
        sData = seriesData[i].split(',');
        /*for (a in sData) {
            sData[a] = parseInt(sData[a], 10);
        }*/
    }
    var data = JSON.parse('[' + sData + ']');
    alert(data);
    data.addRows(data);
}

首先，您已经在上面声明了一个 data 变量(它保存 DataTable)，因此这一行:

var data = JSON.parse('[' + sData + ']');

var 被忽略，data 被覆盖。其次，在这一行中，sData 是一个数组(根据 sData = seriesData[i].split(',');)。第三，由于您覆盖了 data，因此当您在此行调用 data 时，它不再具有 addRows 方法:

data.addRows(data);

假设 seriesData[i] 是 'foo,bar,cad' 形式的字符串，您的循环应如下所示:

for (var i = 0; i < seriesData.length; i++) {
    if (seriesData[i] != null) {
        var sData = seriesData[i].split(',');
        if (sData.length != data.getNumberOfColumns()) {
            // throw an error
        }
        else {
            data.addRows(sData);
        }
    }
}