How to start the alignment of highchart bars from left side even for single bar

Question

I need to start the alignment of highchart bars from left side even for single bar. I have gone through the highcharts doc but i didn't find any. can anyone help on this. thanks in advance.

Answer 1

There is no direct option to set a fixed gap between the yAxis and the first point of the graph. You can try and add a null value to the data you will then get a break and hide first label via xAxis.showFirstLabel.

  series: [{
    type: 'column',
    data: [null, 0, 1, 2, 3, 6, 5]
  }]

Live demo: https://jsfiddle.net/BlackLabel/8jqmotvx/

Another approach will be to move yAxis using yAxis.offset and drawing path lines to every horizontal lines (grids and axis) with Highcharts.SVGRenderer#path

  chart: {
    events: {
      render: function() {
        var chart = this,
          xAxisLeft = chart.xAxis[0].left,
          xAxisHeight = chart.xAxis[0].height + chart.xAxis[0].top;

        var xAxis = chart.xAxis[0];

        if (chart.myPath) {
          chart.myPath.destroy();
        }

        chart.myPath = chart.renderer.path(['M', xAxisLeft, xAxisHeight, 'L', 100, xAxisHeight])
          .attr({
            'stroke-width': 1,
            stroke: '#ccd6eb',
            fill: 'none'
          })
          .add();
      }
    },
  },
  series: [{
    type: 'column',
    data: [0, 1, 2, 3, 6, 5]
  }],
  yAxis: {
    offset: 120
  }

Live demo: https://jsfiddle.net/BlackLabel/8jqmotvx/1/