如何为highcharts创建Json格式的数据
Posted
技术标签:
【中文标题】如何为highcharts创建Json格式的数据【英文标题】:How to create data in Json format for highcharts 【发布时间】:2017-12-11 12:54:53 【问题描述】:我通过 ajax 得到低于结果,而我在 ajax 成功中得到的数据是
[
"plants_ref_id": "1",
"plant_name": "MCW",
"employees_data": "6,6,80,70,60,30,2,3,12,12,37.00,60.00,64666.666667,8000.0000"
,
"plants_ref_id": "3",
"plant_name": "SJCPL",
"employees_data": "4,5,6,7,7,7,6,4,4,5,20.00,3.00,176923.076923,38461.5385"
]
我正在尝试将此数据转换为格式
[
name: 'MCW',
data: [6,6,80,70,60,30,2,3,12,12,37.00,60.00,64666.666667,8000.0000
],
name: 'SJCPL',
data: [4,5,6,7,7,7,6,4,4,5,20.00,3.00,176923.076923,38461.5385]
]
我正在尝试转换为这种格式以生成高图为https://jsfiddle.net/mcj075jf/
如何在 jQuery 中使用 for 循环或 $.each
转换为上述格式。请帮忙。
【问题讨论】:
【参考方案1】:你可以使用map
如下:
var plants = [
"plants_ref_id": "1",
"plant_name": "MCW",
"employees_data": "6,6,80,70,60,30,2,3,12,12,37.00,60.00,64666.666667,8000.0000"
,
"plants_ref_id": "3",
"plant_name": "SJCPL",
"employees_data": "4,5,6,7,7,7,6,4,4,5,20.00,3.00,176923.076923,38461.5385"
];
var formattedData = plants.map((plant) => (
name: plant.plant_name,
data: plant.employees_data.split(',').map((data) => parseFloat(data))
));
console.log(formattedData);
【讨论】:
如果我将相同的数据传递给 highcharts 图表不会显示。请在此处查看jsfiddle.net/mcj075jf/1 @rjirji 我想我们需要将该字符串数组转换为数字。检查我编辑的答案:) 我更改了您的 jsfiddle 以使用我编辑的答案进行修复,它现在正在工作!jsfiddle.net/17rf4ugt【参考方案2】:这里有解决方案https://jsfiddle.net/z10jheo2/
var data = [
"plants_ref_id": "1",
"plant_name": "MCW",
"employees_data": "6,6,80,70,60,30,2,3,12,12,37.00,60.00,64666.666667,8000.0000"
,
"plants_ref_id": "3",
"plant_name": "SJCPL",
"employees_data": "4,5,6,7,7,7,6,4,4,5,20.00,3.00,176923.076923,38461.5385"
];
var newData = [];
for(var i=0; i<data.length; i++)
var tempData = ;
tempData.name = data[i].plant_name;
tempData.data = data[i].employees_data.split(',');
newData.push(tempData);
console.log(newData);
【讨论】:
如果我将相同的数据传递给 highcharts 图表不会显示。请在此处查看jsfiddle.net/z10jheo2/1 这里有解决方案 jsfiddle.net/17rf4ugt 。由于我是根据逗号拆分数据,我们需要恢复为浮点数来填充图表。以上是关于如何为highcharts创建Json格式的数据的主要内容,如果未能解决你的问题,请参考以下文章
使用数据绑定 PowerBI 的 Highcharts 自定义视觉效果
如何从codeigniter中的模型生成json格式到Highchart
使用 MySQL 为 HighCharts 每月格式化 JSON 数据
为 Django 模板中的 Highcharts 从 Pandas 数据帧格式化 JSON
JQuery Javascript 函数以 JSON 格式返回 highchart 图形数据源,并通过 Selenium 和 C# 正确格式化