Google 添加对象数组的折线图

Question

我有一个通过解析 JSON 字符串创建的对象数组：

    var measurementData = @Html.Raw(JsonConvert.SerializeObject(this.Model.Item1));
    var stringifiedData = JSON.stringify(measurementData);
    var parsedData = JSON.parse(stringifiedData);

这给了我一些对象，具体取决于模型，看起来像这样：

现在我的问题是，如何将这些添加到 Google 折线图中而不必将其硬编码到数据表中？

这是我现在得到的，有点用：

        var data = new google.visualization.DataTable();
        data.addColumn('string', 'TimeStamp');
        data.addColumn('number', selectedMeasurements);

        data.addRows([
            [parsedData[index[0]].TimeStamp, parsedData[index[0]][selectedMeasurements]],
            [parsedData[index[1]].TimeStamp, parsedData[index[1]][selectedMeasurements]]
        ]);

        chart.draw(data, options, {
            isStacked: true,
            vAxis: {
                viewWindowMode: 'explicit',
                viewWindow: {
                    max: 100,
                    min: 0
                }
            }
        });

这里我将两个包含数据的数组添加到数据表中，因为要添加两个对象。但如果我只有一个呢？还是 10 个？我想象 .addRows 中有某种 foreach，但我不确定如何实现。

感谢任何帮助！

Answer 1

您可以使用"setValue(rowIndex, columnIndex, value)"方法：

var jsonData = '[{"SlideId":"D2011", "InstrumentId":"I335", "IncMin":"37.13", "IncMax": "37.19", "BrMin":"31.4"}, {"SlideId":"D2014", "InstrumentId":"I335", "IncMin":"37.13", "IncMax": "37.19", "BrMin":"31.4"}]';

var parsedData = JSON.parse(jsonData);
var len = parsedData.length;

var data = new google.visualization.DataTable();
data.addColumn('string', 'TimeStamp');
data.addColumn('number', selectedMeasurements);

data.addRows(len);

for (var n = 0; n < len; n++) {
    var i=0;
    for (var key in parsedData[n]) {
        data.setValue(n, i, parsedData[n][key]);
        i++;
    }
}

chart.draw(data, options, {
        isStacked: true,
        vAxis: {
            viewWindowMode: 'explicit',
            viewWindow: {
                max: 100,
                min: 0
            }
        }
});

http://jsfiddle.net/mblenton/qnusuLtn/2/

Google 添加对象数组的折线图

Google Line Chart Adding Array of Objects

javascript

google-visualization