如何将数据json显示到2种不同的高图栏

Question

我试着用条形图显示数据。酒吧的高架车应该只有两个酒吧，而且两个酒吧都有数据。

所以这里的解释..。

我有两个类别条形图，和两个类别有一个子类别。

这里要说明的是类别的数据：

第一类：

scategori 1-1, scategori 2-1,scategori3-1

下面是第二类：

scategori 1-2,scategori 2-2,scategori 3-2,scategori 4-2,scategori 5-2,scategori 6-2

，下面是我想要实现的示例:

​

​

这两种数据都来自于这个json数据：

[{
"name": "scategories 1-1",
"color": "#1E4585",
"data": [
  {
    "y": 40,
    "total": 40,
    "data": "1",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 2-1",
"color": "#600AB5",
"data": [
  {
    "y": 40,
    "total": 40,
    "data": "2",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 3-1",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 1-2",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 2-2",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 3-2",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 4-2",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 5-2",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},
{
"name": "scategories 6-2",
"color": "#0DB9D0",
"data": [
  {
    "y": 20,
    "total": 20,
    "data": "3",
    "name": "National",
    "drilldown": "3",
    "next": "level2"
  }
]
},]

当我尝试上面的数据json到高图集的脚本时。结果不像我想要的那样。

这里是我尝试的结果：

​

​

有人能帮我实现我想要达到的目标吗?还是能取得与Ico想要的一样的结果？

Answer 1

您需要使用stack属性并创建两个堆栈。示例：

var series = [{
        stack: 'A',
        ...
    },
    {
        stack: 'B',
        ...
    }
];

现场演示： http://jsfiddle.net/BlackLabel/0fbrac5g/

API参考： https://api.highcharts.com/highcharts/series.column.stack