Javascript Highcharts柱形图分组

好吧，这有点棘手。我有以下对象的数组：

现在，我的目标是创建类似以下内容的柱状图：

然后是数组中的下一个对象

我一直在查看文档，我所能找到的是这样的内容：

问题在于您在序列中设置的

数据

值。如果插入数组，它将被拆分为所有类别。就我所知，您无法将一个数据系列锁定到一个类别

我的问题是，以前有没有人做过类似的事情，并且能够帮助我

我的尝试：

我试图在这把小提琴里：

 Highcharts.chart('container', {
        xAxis: {
            minPadding: 0.05,
            maxPadding: 0.05,
            categories: ['Apples', 'Oranges', 'Pears', 'Bananas', 'Plums']
        },
        series: [{
                type: 'column',
            name: 'Apples',
            zoneAxis: 'x',
            data: [
                ['First', 29.9],
                ['Second', 71.5],
                ['Third', 106.4]
            ]
        },{
            type: 'column',
          name: 'oranges',
          data:[
            ['A', 20]
          ]
        }]
    });

---

实现这一点的方法可能有很多，最佳选择取决于您的需求有多具体

我想到的第一种方法就是操纵数据和类别的结构

示例：

   xAxis: {
      categories: ['Group 1', 'Group 2', 'Group 3'],
      labels: { style: { fontWeight: 'bold' } }
    },
    series: [{
      name: 'Subset A',
            data: [{y: 10, name: '1A'}, {y: 5, name: '2A'}, {y: 7, name: '3A'}]
    }, {
      name: 'Subset B',
            data: [{y: 5, name: '1B'}, {y: 3, name: '2B'}, {y: 4, name: '3B'}]
    }]

假设有三组，每组有两点。您希望第一个类别显示组1中的A点和B，第二个类别显示组2中的A点和B，以此类推

小提琴：

   xAxis: {
      categories: ['Group 1', 'Group 2', 'Group 3'],
      labels: { style: { fontWeight: 'bold' } }
    },
    series: [{
      name: 'Subset A',
            data: [{y: 10, name: '1A'}, {y: 5, name: '2A'}, {y: 7, name: '3A'}]
    }, {
      name: 'Subset B',
            data: [{y: 5, name: '1B'}, {y: 3, name: '2B'}, {y: 4, name: '3B'}]
    }]

输出：

   xAxis: {
      categories: ['Group 1', 'Group 2', 'Group 3'],
      labels: { style: { fontWeight: 'bold' } }
    },
    series: [{
      name: 'Subset A',
            data: [{y: 10, name: '1A'}, {y: 5, name: '2A'}, {y: 7, name: '3A'}]
    }, {
      name: 'Subset B',
            data: [{y: 5, name: '1B'}, {y: 3, name: '2B'}, {y: 4, name: '3B'}]
    }]

这样做的主要潜在缺点是图例将显示/隐藏点A或B，而不是组1、2或3

如果存在问题，可以通过添加一个函数来显示/隐藏类别来解决此问题

请在此处查看此问题的答案：

这里还有相关的小提琴：

---

与相关的Highcharts演示相比，更容易使用实际代码和示例。简短的回答是肯定的，你是正确的，它不意味着这样工作，但也是肯定的，通过一些操纵，你应该能够得到你需要的。