如何将我的 JSON 结构更改为 chartJS 条形图 JSON 结构？

Question

[  0: {flight: "Spicejet", range: "min", Jul 1: 2397, Jul 2: 2397, Jul 3: 2397},1: {flight: "Spicejet", range: "max", Jul 1: 3045, Jul 2: 3045, Jul 3: 3045,},2: {flight: "Spicejet", range: "med", Jul 1: 2789, Jul 2: 2789, Jul 3: 2789,},3: {flight: "Indigo", range: "min", Jul 1: 3000, Jul 2: 3000, Jul 3: 3000,},4: {flight: "Indigo", range: "max", Jul 1: 5000, Jul 2: 5000, Jul 3: 5000,},5: {flight: "Indigo", range: "med", Jul 1: 4000, Jul 2: 4000, Jul 3: 4000,},] 进入labels: ["Jul 1","Jul 2","Jul 3"],datasets: [          {            label: "SpiceJet",            data: [3045,3045,3045],          },          {            label: "airways",            data: [5000,5000,5000],          },   ]对于 chartJS reactjs（线图）。在这种情况下，chartjs 很复杂，请在此提供一些解决方案。在数据集中[{data:[仅获取范围“最大值”]}]

Answer 1

虽然关于目标格式的预期用途的问题尚不清楚，但可以轻松实现示例的实际转换。

如果我们假设所有输入元素共享相同的数据属性（Jul *在这种情况下），我们可以从任意输入元素中提取标签。数据集可以通过映射输入数据获得。

// a filter function to determine the data properties we're interested in

let dataPropertiesFilter = (k) =>  k !== "flight" && k !== "range";

let result = {

  // this assumes the first element has all data properties set and subsequent ones share the same properties

  labels: Object.keys(input[0]).filter(dataPropertiesFilter),

  // transforms each input element into the target format

  datasets: input.map(e => {

    return {

      label: e.flight,

      data: Object.keys(e)

        .filter(dataPropertiesFilter)

        .map(v => e[v])

    };

  })

};

这是一个用于演示的代码框：https ://codesandbox.io/s/stack-overflow-q-62406854-vzxnq?file=/src/index.js