Javascript 通过json数组属性循环
我正在使用JQuery、ChartJS、Moment.js以JSON格式为同一页面上的多个图表收集数据,但来自同一JSON源。在JSON中,高度对象是一个图形,长度对象是另一个图形。 这是一个关于JSON外观的示例Javascript 通过json数组属性循环,javascript,arrays,json,properties,chart.js,Javascript,Arrays,Json,Properties,Chart.js,我正在使用JQuery、ChartJS、Moment.js以JSON格式为同一页面上的多个图表收集数据,但来自同一JSON源。在JSON中,高度对象是一个图形,长度对象是另一个图形。 这是一个关于JSON外观的示例 "Series": { "heights": [ { "Date": "2014-10-01", "Value": 22 }, { "Date": "2014-10-01",
"Series": {
"heights": [
{
"Date": "2014-10-01",
"Value": 22
},
{
"Date": "2014-10-01",
"Value": 53
},
{
"Date": "2014-10-01",
"Value": 57
},
],
"lengths": [
{
"Date": "2014-10-01",
"Value": 54
},
{
"Date": "2014-10-01",
"Value": 33
}
]
}
我已经设法循环使用JSON来显示每个图形,但我不能真正使用“干-不要重复你自己”的方式。现在我有大量难以更新/读取的代码
$.getJSON("data.json", function(data) {
var dateArray = [];
var valueArray = [];
for ( var i = 0; i < data.Series["heights"].length; i++) {
var obj = data.Series.heights[i];
var date = obj["Date"].toString();
var Value = obj["Value"];
for ( var key in obj) {
//console.log(obj["Value"]);
//date = obj["Date"];
Value = obj[key].toString();
}
valueArray.push(Value);
dateArray.push(moment(date).format("MMMM Mo"));
var dataArray = {
labels: dateArray,
datasets: [
{
label: "Lengths",
strokeColor: "rgb(26, 188, 156)",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "#fff",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: valueArray
}
]
};
}
var ctx = document.getElementById("lengthsChart").getContext("2d");
var myLineChart = new Chart(ctx).Line(dataArray, {
scaleShowGridLines : true,
bezierCurve : true,
bezierCurveTension : 0.4,
datasetStroke : false,
fillColor: "rgba(0,0,0,0)",
datasetFill : false,
responsive: true,
showTooltips: true,
animation: false
});
});
$.getJSON(“data.json”),函数(数据){
var dateArray=[];
var-valueArray=[];
对于(变量i=0;i
现在我在一个switch语句中有这个代码,用于“heights”,“length”等。。。我想这是一种可怕的方式。但我无法对单个图表进行循环 我试过这样的方法:
for(var x in measurement) {
console.log(measurement[x]);
for ( var i = 0; i < data.Series.hasOwnProperty(measurement).length; i++) {
var obj = data.Series.hasOwnProperty(measurement)[i];
var date = obj["Date"].toString();
var Value = obj["Value"];
console.log(date, Value);
}
console.log(series);
console.log(series.heights);
console.log(series.heights.dates);
console.log(series.heights.values);
console.log(series.lengths);
console.log(series.lengths.dates);
console.log(series.lengths.values);
for(测量中的var x){
控制台日志(测量[x]);
对于(var i=0;i
但我无法让它工作,无法在data.Series./heights/length../[I]
我非常感谢你给我的建议如何做到这一点
谢谢!如果你用
data.Series
替换measurement
,去掉hasOwnProperty(measurement)
这件事,你就差不多做到了。你需要的唯一一件事是保持从{Date,Value}对象列表到每个系列的日期和值列表的转换
var series = {};
// This loop is looping across all the series.
// x will have all the series names (heights, lengths, etc.).
for (var x in data.Series) {
var dates = [];
var values = [];
// Loop across all the measurements for every serie.
for (var i = 0; i < data.Series[x].length; i++) {
var obj = data.Series[x][i];
// Assuming that all the different series (heights, lengths, etc.) have the same two Date, Value attributes.
dates.push(obj.Date);
values.push(obj.Value);
}
// Keep the list of dates and values by serie name.
series[x] = {
dates: dates,
values: values
};
}
所以你可以这样使用它们:
for(var x in measurement) {
console.log(measurement[x]);
for ( var i = 0; i < data.Series.hasOwnProperty(measurement).length; i++) {
var obj = data.Series.hasOwnProperty(measurement)[i];
var date = obj["Date"].toString();
var Value = obj["Value"];
console.log(date, Value);
}
console.log(series);
console.log(series.heights);
console.log(series.heights.dates);
console.log(series.heights.values);
console.log(series.lengths);
console.log(series.lengths.dates);
console.log(series.lengths.values);
如果我理解正确,您希望来自相同json的高度和长度数组通过相同的代码通道并生成dataArray(输出图表对象)。如果是这样,您的配置点是data.Series的属性键。您的输出(dataArray对象)在哪里转到?两个数组的对象是否总是具有相同的模式、日期和值属性?