我是 json 新手,我想创建一个 HighChart,我有 JSON 格式的数据,我已将其转换为表格格式 [下面是从 JSON 中提取的数据和列]。
地点 日期范围 点击次数
雅虎搜索 2010-04-01 2172
谷歌 2010-04-01 10830
MSN 2010-04-01 555
SSP 2010-04-01 0
雅虎搜索 2010-04-02 1746
谷歌 2010-04-02 8508
MSN 2010-04-02 477
谷歌 2010-04-03 5061
雅虎搜索 2010-04-03 1113
MSN 2010-04-03 192
我想创建以下格式的 JSON 字符串。我该如何执行此操作
xAxis: {categories: ['2010-04-01', '2010-04-02', ' 2010-04-03']},
series: [{
name: 'Yahoo Search',
data: [2172 ,1746,1113]
},
{
name: 'Google',
data: [10830,8508,5061]
},
{
name: 'MSN',
data: [555,477,792]
},
{
name: 'SSP',
data: [0,0,0]
}]
我的 json 数据在这里
{"schema":{"fields":[{"name":"NM_Venue","type":"STRING","mode":"NULLABLE"},{"name":"NM_DateRange","type":"STRING","mode":"NULLABLE"},{"name":"M_Clicks","type":"INTEGER","mode":"NULLABLE"}]},"totalRows":"10","rows":[{"f":[{"v":"Yahoo Search"},{"v":"2010-04-01"},{"v":"2172"}]},{"f":[{"v":"Google"},{"v":"2010-04-01"},{"v":"10830"}]},{"f":[{"v":"MSN"},{"v":"2010-04-01"},{"v":"555"}]},{"f":[{"v":"SSP"},{"v":"2010-04-01"},{"v":"0"}]},{"f":[{"v":"Yahoo Search"},{"v":"2010-04-02"},{"v":"1746"}]},{"f":[{"v":"Google"},{"v":"2010-04-02"},{"v":"8508"}]},{"f":[{"v":"MSN"},{"v":"2010-04-02"},{"v":"477"}]},{"f":[{"v":"Google"},{"v":"2010-04-03"},{"v":"5061"}]},{"f":[{"v":"Yahoo Search"},{"v":"2010-04-03"},{"v":"1113"}]},{"f":[{"v":"MSN"},{"v":"2010-04-03"},{"v":"192"}]}],
"result":{"schema":{"fields":[{"name":"NM_Venue","type":"STRING","mode":"NULLABLE"},{"name":"NM_DateRange","type":"STRING","mode":"NULLABLE"},{"name":"M_Clicks","type":"INTEGER","mode":"NULLABLE"}]},"totalRows":"10","rows":[{"f":[{"v":"Yahoo Search"},{"v":"2010-04-01"},{"v":"2172"}]},{"f":[{"v":"Google"},{"v":"2010-04-01"},{"v":"10830"}]},{"f":[{"v":"MSN"},{"v":"2010-04-01"},{"v":"555"}]},{"f":[{"v":"SSP"},{"v":"2010-04-01"},{"v":"0"}]},{"f":[{"v":"Yahoo Search"},{"v":"2010-04-02"},{"v":"1746"}]},{"f":[{"v":"Google"},{"v":"2010-04-02"},{"v":"8508"}]},{"f":[{"v":"MSN"},{"v":"2010-04-02"},{"v":"477"}]},{"f":[{"v":"Google"},{"v":"2010-04-03"},{"v":"5061"}]},{"f":[{"v":"Yahoo Search"},{"v":"2010-04-03"},{"v":"1113"}]},{"f":[{"v":"MSN"},{"v":"2010-04-03"},{"v":"192"}]}]}}
最佳答案
您可以将现有的 JSON 字符串转换为新的 JSON 字符串,例如使用此功能:
function makeJSONstring(jsonstr) {
var rows = JSON.parse(jsonstr).rows;
console.log(rows);
var data = [];
for (var i=0; i<rows.length; i++) {
data.push({
Venue: rows[i].f[0].v,
DateRange: rows[i].f[1].v,
Clicks: rows[i].f[2].v | 0
});
}
//console.log(data);
var out = {
xAxis: {
categories: [ /*'2010-04-01', '2010-04-02', ' 2010-04-03'*/ ]
},
series: [ /*{ name: 'Yahoo Search', data: [2172 ,1746,1113] } , etc. */ ]
};
var cat = {}, ser = {}; // temporary variables
for (i = 0; i < data.length; i++) {
// data[i].Vanue , data[i].DateRange , data[i].Clicks
if (cat[data[i].DateRange] === undefined) {
cat[data[i].DateRange] = true;
out.xAxis.categories.push(data[i].DateRange);
}
if (ser[data[i].Venue] === undefined) {
ser[data[i].Venue] = out.series.length;
out.series.push({
name: data[i].Venue,
data: [data[i].Clicks]
});
} else {
var index = ser[data[i].Venue];
out.series[index].data.push(data[i].Clicks);
}
}
//console.log(out);
return JSON.stringify(out);
}
或者替代示例,从表中收集数据的位置如下:jsfiddle
关于jquery - 将 JQuery 数据转换为 HighChart 格式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17940071/