簡體   English   中英

如何將自定義 JSON Object 轉換為 Highcharts 系列數據?

[英]How to convert custom JSON Object into Highcharts Series data?

我的 API 結尾有一個自定義 JSON 格式,我需要將其轉換為 Highcharts 系列數據格式,

我的自定義 Json 格式:

[{
        "personId": "7b9b19a8-0052-4036-9d27-721371a3a077",
        "pid": "PID-2",
        "averageCycleTime": 1.28,
        "idealCycleTime": 1.28,
        "cycleDetails": [{
                "cycleId": "fdc074a0-e839-4a93-bdca-93562788fd8d",
                "visionCycleId": "2",
                "cycleDuration": 12.5,
                "actionDetails": null
            },
            {
                "cycleId": "85d5b577-306f-4d69-9649-732ddfc7b228",
                "visionCycleId": "1",
                "cycleDuration": 12.5,
                "actionDetails": null
            }
        ]
    },
    {
        "personId": "f2a2d7b1-e099-4f78-8bfd-804158d21b09",
        "pid": "PID-1",
        "averageCycleTime": 1.28,
        "idealCycleTime": 1.28,
        "cycleDetails": [{
                "cycleId": "5860c566-cbf9-4d36-be1e-21e27402e8c1",
                "visionCycleId": "1",
                "cycleDuration": 12.5,
                "actionDetails": null
            },
            {
                "cycleId": "7acf1cab-7d55-412e-8381-102d5aad0a3a",
                "visionCycleId": "2",
                "cycleDuration": 12.5,
                "actionDetails": null
            }
        ]
    }
]

從上面的 JSON 中,“cycleDetails”鍵值的詳細信息應放置如下

series: [{
        name: 'Cycle-1',
        data: [{y:5, videoID : 'Video1'}, {y: 3, videoID : 'Video2'}],
    }, {
        name: 'Cycle-2',
        data: [{y:5, videoID : 'Video1'}, {y: 3, videoID : 'Video2'}]
    }]

** Y 上的 CycleDuration 和 cycleId 到 VideoID。

嘗試這個:

const customJson = [
  {
    personId: '7b9b19a8-0052-4036-9d27-721371a3a077',
    pid: 'PID-2',
    averageCycleTime: 1.28,
    idealCycleTime: 1.28,
    cycleDetails: [
      {
        cycleId: 'fdc074a0-e839-4a93-bdca-93562788fd8d',
        visionCycleId: '2',
        cycleDuration: 12.5,
        actionDetails: null,
      },
      {
        cycleId: '85d5b577-306f-4d69-9649-732ddfc7b228',
        visionCycleId: '1',
        cycleDuration: 12.5,
        actionDetails: null,
      },
    ],
  },
  {
    personId: 'f2a2d7b1-e099-4f78-8bfd-804158d21b09',
    pid: 'PID-1',
    averageCycleTime: 1.28,
    idealCycleTime: 1.28,
    cycleDetails: [
      {
        cycleId: '5860c566-cbf9-4d36-be1e-21e27402e8c1',
        visionCycleId: '1',
        cycleDuration: 12.5,
        actionDetails: null,
      },
      {
        cycleId: '7acf1cab-7d55-412e-8381-102d5aad0a3a',
        visionCycleId: '2',
        cycleDuration: 12.5,
        actionDetails: null,
      },
    ],
  },
];

const series = customJson.map((value, key) => {
  return {
    name: `Cycle-${key + 1}`,
    data: value.cycleDetails.map((v) => ({
      y: v.cycleDuration,
      videoId: v.cycleId,
    })),
  };
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM