High charts: Can we reduce the distance between two bars in grouped column chart

227 views Asked by At

Using this example from Highcharts for displaying grouped column chart with negative values https://www.highcharts.com/demo/column-negative

When we have less attributes in x-axis, the distance between both bars of the same value becomes wider. Can we reduce this distance by using any option & make the two bars look close to each other for each month. Attaching output with question. Sample chart

Options I am using are:

plotOptions: {
    column: {
       dataLabels: {
          enabled: false
       },
       pointWidth: 15
    },
    series: {
       centerInCategory: true
    }
},
1

There are 1 answers

1
Karol Kołodziej On BEST ANSWER

Using the groupPadding and pointWidth property you can adjust the space between the grouped columns.

 plotOptions: {
    column: {
      dataLabels: {
        enabled: false
      },
      groupPadding:0.35,
      pointWidth: 25
    }
  },

API:
https://api.highcharts.com/highcharts/series.column.groupPadding
https://api.highcharts.com/highcharts/series.column.pointWidth

Live demo:
https://jsfiddle.net/BlackLabel/kfwz7gce/