Javascript 将组json转换为Highcharts圆环图

此问题用于创建具有多个系列的Highcharts甜甜圈图表

我有JSON输入数据模型的动态键属性

xData，yData

：

  xData= ["Phase", "Step", "Task"];
  yData = ["VPhase", "VStep", "VTask"]

  inputArray = [
    { Phase: "Phase 1", VPhase: 100, Step: "Step 1", VStep:50, Task: "Task 1", VTask: 20 },
    { Phase: "Phase 1", VPhase: 100, Step: "Step 1", VStep:50, Task: "Task 2", VTask: 30 },
    { Phase: "Phase 1", VPhase: 100, Step: "Step 2", VStep:50, Task: "Task 1", VTask: 25 },
    { Phase: "Phase 1", VPhase: 100, Step: "Step 2", VStep:50, Task: "Task 2", VTask: 25 },
    { Phase: "Phase 2", VPhase: 150, Step: "Step 1", VStep:100,Task: "Task 1", VTask: 60 },
    { Phase: "Phase 2", VPhase: 150, Step: "Step 1", VStep:100,Task: "Task 2", VTask: 40 },
    { Phase: "Phase 2", VPhase: 150, Step: "Step 2", VStep:50, Task: "Task 1", VTask: 15 },
    { Phase: "Phase 2", VPhase: 150, Step: "Step 2", VStep:50, Task: "Task 2", VTask: 35 }
  ];

我需要组和不同的连续索引

xData，yData

，以创建类似的输出结果：

outputArray = [
    {
      Phase: ["Phase 1", "Phase 2"],
      VPhase: [100, 150]
    },
    {
      Step: ["Step 1", "Step 2", "Step 1", "Step 2"],
      VStep: [50, 50, 100 ,50]
    },
    {
      Task: ["Task 1", "Task 2", "Task 1", "Task 2", "Task 1", "Task 2", "Task 1", "Task 2"],
      VTask: [20, 30, 25, 25, 60, 40, 15, 35]
    }
  ];

---

经过一些努力，我最终得到了这个解决方案：

常量输入数组=[
{阶段：“阶段1”，VPhase:100，步骤：“步骤1”，VStep:50，任务：“任务1”，VTask:20}，
{阶段：“阶段1”，VPhase:100，步骤：“步骤1”，VStep:50，任务：“任务2”，VTask:30}，
{阶段：“阶段1”，VPhase:100，步骤：“步骤2”，VStep:50，任务：“任务1”，VTask:25}，
{阶段：“阶段1”，VPhase:100，步骤：“步骤2”，VStep:50，任务：“任务2”，VTask:25}，
{阶段：“阶段2”，VPhase:150，步骤：“步骤1”，VStep:100，任务：“任务1”，VTask:60}，
{阶段：“阶段2”，VPhase:150，步骤：“步骤1”，VStep:100，任务：“任务2”，VTask:40}，
{阶段：“阶段2”，VPhase:150，步骤：“步骤2”，VStep:50，任务：“任务1”，VTask:15}，
{阶段：“阶段2”，VPhase:150，步骤：“步骤2”，VStep:50，任务：“任务2”，VTask:35}
];
函数getGroupedData（数据、第一次、第二次）{
const reduced=data.reduce（函数（m，d）{
如果（！m）m={}；
firsts.forEach（函数（键）{
如果（！m[key]）m[key]=[]；
m[键]。按（d[键]）；
});
秒。forEach（功能（键）{
如果（！m[key]）m[key]=[]；
m[键]。按（d[键]）；
});
返回m；
}, {});
常量obj=[]；
for（第一个变量中的第一个变量）{
常数o={}；
o[firsts[i]]=减少的[firsts[i]]
o[秒[i]]=减少的[秒[i]]
目标推力（o）；
}
常量final=[]；
对象forEach（c=>{
var keys=Object.keys（c）；
对于（c中的变量i[键[0]]）{
常数o={}；
o[键[0]]=c[键[0]][i]；
o[键[1]]=c[键[1]][i]；
如果（！final.some（p=>p[keys[0]]==c[keys[0]]]i]&&p[keys[1]]==c[keys[1]]i]））
最后，推（o）；
}
})
常量输出=[]；
for（第一个变量中的第一个变量）{
常数o={}；
o[firsts[i]]=[]；
o[秒[i]]=[]；
final.forEach（c=>{
if（c[firsts[i]]）{
o[firsts[i].[push（c[firsts[i]]）；
o[秒[i]]。按（c[秒[i]]）；
}
})
输出推力（o）；
}
控制台日志（输出）；
}
getGroupedData（输入阵列、[“阶段”、“步骤”、“任务”]、[“VPhase”、“VStep”、“VTask”]）；

。你用过代码，但代码似乎不是关于图表的，而是关于图表的。如果您对Highcharts有问题，请提供一个带有硬编码示例数据的演示。