我尝试在Angular中使用Highcharts JS库。
我用Column Drilldown model。

目标：

图表的数据部分必须如下所示：

data: [{
  name: 'text name',
  y: 5,
  drilldown: 'text name'
}]

我的目标是用数组填充数据部分，而不是手动输入。

数据：

我的数组看起来像这样：

var arr = { "Type1": 1.44, "Type2": 0.64, "Type3": 0.20, "Type4": 1.70 }

所以Highcharts数据部分应该变成：

data: [{
      name: 'Type1',
      y: 1.44,
      drilldown: 'Type1'
    },
{
      name: 'Type2',
      y: 0.64,
      drilldown: 'Type2'
    },
{
      name: 'Type3',
      y: 0.20,
      drilldown: 'Type3'
    },
{
      name: 'Type4',
      y: 1.70,
      drilldown: 'Type4'
    }
]

正在进行的工作：

我尝试构建一个名为 myarray 的数组，如下所示：

var myarray = [];

for (const [a, b] of Object.entries(arr)) {
  myarray.push("{name:'" + a + "', y:" +b + ", drilldown:'" + a + "'}")
}

它返回：

["{name:'Type1', y:1.44, drilldown:'Type1'}", "{name:'Type2', y:0.64,
drilldown:'Type2'}", "{name:'Type3', y:0.2, drilldown:'Type3'}",
"{name:'Type4', y:1.7, drilldown:'Type4'}"]

...不完全符合Highcharts语法。我试过了...

data: [
      myarray
    ]

...它确实失败了。也许是因为撇号的原因？
你如何纠正它使图表工作？
请看我在JSFiddle上的尝试。
任何帮助将非常感激，谢谢！