谷歌折线图添加对象数组

问题描述

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

  var measurementData = @Html。原始（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）; 
 $ b 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，但我不确定如何完成此操作。

任何帮助表示赞赏！

解决方案

您可以使用setValue

$ $ p $ var $ jsonData ='[{SlideId：D2011，InstrumentId，rowIndex，columnIndex，value）方法：

：I335，IncMin：37.13，IncMax：37.19，BrMin：31.4，{SlideId：D2014，InstrumentId：I335 ：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）; （var n = 0; 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
}
}
}）;

I have an array of objects which I've created by parsing a JSON string:

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

This gives me a number of objects, depending on the model, looking like this:

Now my question is, how do I add these to a Google line chart without having to hardcode it into the datatable?

This is what I've got now, which works somewhat:

        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
                }
            }
        });

Here I'm adding two arrays with data to the datatable, since there is two objects to add. But what if I only have one? Or 10? I imagine some kind of foreach inside the .addRows but I'm not sure how to accomplish this.

Any help appreciated!

解决方案

You can use "setValue(rowIndex, columnIndex, value)" method:

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/

这篇关于谷歌折线图添加对象数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！