我想根据以下 JSON(从 HQL-hibernate Java Play 框架接收)绘制 C3js 饼图... JSON 看起来像这样(这是动态数据):
{"ug":["K","M2","M3","M4"],"wtv":[10,20,35,60]}
HTML:
<div id="chart"></div>
JS(我实际尝试过的):
var json ={"ug":["K","M2","M3","M4"],"wtv":[10,20,35,60]};
var ug =json.ug;
var wtv=json.wtv;
var chart = c3.generate({
data: {
json: {
ug:wtv[0],
ug1:wtv[1],
ug2:wtv[2],
ug3:wtv[3],
},
type : 'pie',
}
});
Here is a fiddle for reference.
在 ug、ug1、ug2、ug3 的地方我需要 K、M2、M3、M4(要注意这些是动态数据) 任何人都可以帮我操作数据以根据需要绘制饼图吗? 我希望在后端更改 JSON 的结构不是唯一的解决方案(尽管对我来说这非常困难)。感谢任何其他解决方案。
最佳答案
只要 "ug"
和 "wtv"
具有相同数量的元素...
var json = {"ug":["K","M2","M3","M4"],"wtv":[10,20,35,60]};
var pieJson = {};
json.ug.forEach(function (ug, index) {
pieJson[ug] = json.wtv[index];
});
var chart = c3.generate({
data: {
// iris data from R
json: pieJson,
type : 'pie',
}
});
关于javascript - 如何在 c3js 饼图上绘制自定义 JSON 数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45081618/