arrays - Angular 11 - 如何将数组数据导入highcharts

Question

我正在使用 Angular 11，打字稿

我有这个数组结构，我想在 highcharts 中导入，但我不知道怎么做。我正在使用 api 响应来获取数据，每次用户进行新测验时，它都会添加另一组 quiz_title，通过和失败。

 "message": "Remarks successfuly shown",
    "error": false,
    "error code": 200,
    "line": "line215215",
    "quizRemarks": [
        {
            "Quiz_Title": "Acts and Regulation",
            "Passed": "24",
            "Failed": "6"
        },
        {
            "Quiz_Title": "Breakdowns and Accidents",
            "Passed": "7",
            "Failed": "3"
        },
        {
            "Quiz_Title": "Coupling and Uncoupling Semi-Trailers",
            "Passed": "2",
            "Failed": "8"
        },
        {
            "Quiz_Title": "Defensive Driving",
            "Passed": "2",
            "Failed": "37"
        },
        {
            "Quiz_Title": "Driver Health and Safety",
            "Passed": "7",
            "Failed": "1"
        },
        {
            "Quiz_Title": "General Knowledge",
            "Passed": "4",
            "Failed": "14"
        }
    ]
}

标签： arraysangulartypescriptapihighcharts

Answer 1

这是您想要实现的输出吗？

const chartData = dataFromServer.map(data => ({
  name: data["Quiz_Title"],
  data: [{
      name: 'Passed',
      y: parseInt(data["Passed"])
    },
    {
      name: 'Failed',
      y: parseInt(data["Failed"])
    }
  ]
}));

https://jsfiddle.net/BlackLabel/dz1wheut/