如何将对象用作 Highcharts 的系列

Question

我对 javascript 和 Highcharts 真的很陌生，如果这是一个愚蠢的问题，我真的很抱歉。

我有一个像这样的对象（称为 val）：

对象{月：Array[12]，企业：Array[12]，家庭：Array[12]，聚会：Array[12]}

每个数组都包含公司/家庭/派对一段时间内的销售价值。

我想在 Highcharts 中创建一个折线图，其中包含 3 条线（公司、家庭、聚会）随着时间的推移。

下面是我的代码：

$(function () {
$('#expandable-3').highcharts({
    title: {
        text: 'Monthly Average Temperature',
        x: -20 //center
    },
    subtitle: {
        text: 'Source: WorldClimate.com',
        x: -20
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
            'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    yAxis: {
        title: {
            text: 'Temperature (°C)'
        },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        valueSuffix: '°C'
    },
    legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'middle',
        borderWidth: 0
    },
    series: val
});

});

图表显示为空白。

有人可以帮助我了解如何完成这项工作吗？

谢谢。

Answer 1

如果您查看 highcharts 演示中的选项，您可以看到系列是如何指定的。 Highcharts basic line demo

您可以将 val 更改为以下内容：

var val = [
  {
    name: 'corporate',
    data: [1,2,3]
  },
  {
    name: 'family',
    data: [1,2,3]
  },
  {
    name: 'party',
    data: [1,2,3]
  }
];

要转换您的数据，请使用以下内容：

Object.keys(val).map(function (key) { 
  return { 
    name: key, 
    data: val[key] 
  }; 
});