Question

我有7＆＃34;区域＆＃34;在我的数据中，我正在尝试制作Highcharts堆积条形图。我的类别没有正确显示轴中间的第一个。知道为什么吗？期望的结果将是左侧的7个区域，并且它们的两组数据中的每一组彼此相邻堆叠，然后是绿色，然后是红色。

Highcharts.chart('graphContainer', {
  chart: {
    type: 'bar'
  },
  title: {
    text: 'Area Dashboard'
  },
  legend: {
    enabled: false
  },
  xAxis: {
    type: "category",
    uniqueNames: true,
    categories: ["Capital Metro (K)", "Eastern (C)", "Great Lakes (J)", "Northeast (B)", "Pacific (F)", "Southern (S)", "Western (E)"],
  },
  plotOptions: {
    series: {
      stacking: 'normal'
    }
  },
  series: [{
    "name": "Capital Metro (K)",
    "data": [11],
    "stack": "Capital Metro (K)",
    "color": "Red"
  }, {
    "name": "Capital Metro (K)",
    "data": [4],
    "stack": "Capital Metro (K)",
    "color": "Green"
  }, {
    "name": "Eastern (C)",
    "data": [1],
    "stack": "Eastern (C)",
    "color": "Red"
  }, {
    "name": "Eastern (C)",
    "data": [0],
    "stack": "Eastern (C)",
    "color": "Green"
  }, {
    "name": "Great Lakes (J)",
    "data": [0],
    "stack": "Great Lakes (J)",
    "color": "Red"
  }, {
    "name": "Great Lakes (J)",
    "data": [1],
    "stack": "Great Lakes (J)",
    "color": "Green"
  }, {
    "name": "Northeast (B)",
    "data": [1],
    "stack": "Northeast (B)",
    "color": "Red"
  }, {
    "name": "Northeast (B)",
    "data": [0],
    "stack": "Northeast (B)",
    "color": "Green"
  }, {
    "name": "Pacific (F)",
    "data": [13],
    "stack": "Pacific (F)",
    "color": "Red"
  }, {
    "name": "Pacific (F)",
    "data": [6],
    "stack": "Pacific (F)",
    "color": "Green"
  }, {
    "name": "Southern (S)",
    "data": [1],
    "stack": "Southern (S)",
    "color": "Red"
  }, {
    "name": "Southern (S)",
    "data": [0],
    "stack": "Southern (S)",
    "color": "Green"
  }, {
    "name": "Western (E)",
    "data": [1],
    "stack": "Western (E)",
    "color": "Red"
  }, {
    "name": "Western (E)",
    "data": [0],
    "stack": "Western (E)",
    "color": "Green"
  }]
});

Answer 1

使用您当前的选项，每个系列只有一个点，连接到第一个类别。

相反，创建两个系列（一个绿色，一个红色），其中包含数据中的所有点：https://jsfiddle.net/BlackLabel/7sorc0ju/11/

段：

series: [{
  "name": "Capital Metro (K)",
  "data": [11, 1, 0, 1, 13, 1, 1],
  "stack": "Capital Metro (K)",
  "color": "Red"
}, {
  "name": "Capital Metro (K)",
  "data": [4, 0, 1, 0, 6, 0, 0],
  "stack": "Capital Metro (K)",
  "color": "Green"
}]

Highcharts xAxis类别没有恰当地说明

1 个答案: