响应式规则应该会有帮助，你可以根据你的条件制作一个图表。我不确定你是否知道，条形图和柱形图完全一样，只是x轴和y轴互换了。

Highcharts.chart('container', {
  chart: {
    type: 'bar',
    scrollablePlotArea: {
      minHeight: 600
    },
  },
  title: {
    text: 'Stacked bar chart'
  },
  xAxis: {
    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
  },
  yAxis: {
    min: 2,
    title: {
      text: 'Total fruit consumption'
    }
  },
  plotOptions: {
    series: {
      stacking: 'normal'
    }
  },
  series: [{
    name: 'John',
    data: [5, 3, 4, 7, 2]
  }, {
    name: 'Jane',
    data: [2, 2, 3, 2, 1]
  }, {
    name: 'Joe',
    data: [3, 4, 4, 2, 5]
  }],
  responsive: {
    rules: [{
      condition: {
        minWidth: 600
      },
      // Make the labels less space demanding on mobile
      chartOptions: {
        chart: {
          scrollablePlotArea: {
            minHeight: 800
          },
        },
      }
    }]
  }
});

现场演示：https://jsfiddle.net/BlackLabel/ae4z53hw/
API参考：https://api.highcharts.com/highcharts/responsive.rules.condition
最好使用groupPadding、pointPadding和centerInCategory来调整列宽。PointWidth是一个以像素为单位的值，可能更难操作，这样它们就不会重叠。

plotOptions: {
  series: {
    grouping: false,
    stacking: 'normal',
    groupPadding: 0,
    pointPadding: 0,
    centerInCategory: true,
  }
},

https://api.highcharts.com/highcharts/plotOptions.bar.centerInCategory