操纵highcharts栏

Question

我正在探索Highcharts Api并使用堆叠的分组条形图。我想出了改变酒吧外观的想法。我希望它是一个尖头酒吧。可能吗？提前谢谢！

下图：

Answer 1

更改列系列形状可能很困难，因为列系列背后的逻辑适用于矩形，因此需要扩展/更改Highcharts内部代码。

相反，您可以使用polygon series。通过一些配置，您应该能够获得所需的效果。

$(function() {

var labels = {
1: 'Apples',
4: 'Bananas'
};

Highcharts.chart('container', {
  chart: {
    type: 'polygon'
  },
  xAxis: [{
      min: -0.5,
      max: 6,
      tickPositions: [0, 2, 3, 5],
      labels: {
        enabled: false
      }
    }, {
        offset: 0,
        linkedTo: 0,
      tickPositions: [1, 4],
      tickLength: 0,
      labels: {
        formatter: function () {
            return labels[this.value];
        }
      }
    }],
yAxis: {
  min: 0,
  max: 100
},

series: [{
  name: 'series 1',
  id: 's1',
  colorIndex: 0,
  data: [
    [0, 0],
    [0, 25],
    [2, 20],
    [2, 0]
  ]
}, {
  name: 'series 1',
  linkedTo: 's1',
  colorIndex: 0,
  data: [
    [3, 0],
    [3, 68],
    [5, 63],
    [5, 0]
  ]
}, {
  colorIndex: 1,
  id: 's2',
  name: 'series 2',
  data: [
    [0, 25],
    [0, 50],
    [2, 45],
    [2, 20]
  ]
}, {
  name: 'series 2',
  colorIndex: 1,
  linkedTo: 's2',
  data: [
    [3, 68],
    [3, 78],
    [5, 73],
    [5, 63]
  ]
}]
});
});

示例：http://jsfiddle.net/stfhhn7y/