Question

I have a HighCharts chart to display some information. I have stacked information for each day. Each entry is unique -> I cannot use a single series.

The problem is: between two days, there’s a huge space and I have no idea how to decrease or remove this.
There’s no effect when I play with the PlotOptions.
I think the reason is my xAxis-Handling, because if I use the “normal way” to declare the xAxis categies, there’s no problem.

My jsFiddle: http://jsfiddle.net/MhL2Q/1/

Another, working jsFiddle: jsfiddle_dot_net/wergeld/M85tL/ (just 2 links allowed)

Original HighChart DEMO: http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-stacked/

Answer 1

You can make use of xAxis.minPadding and xAxis.maxPadding

Padding of the max value relative to the length of the axis. A padding
of 0.05 will make a 100px axis 5px longer. This is useful when you
don’t want the highest data value to appear on the edge of the plot
area. When the axis’ max option is set or a max extreme is set using
axis.setExtremes(), the maxPadding will be ignored. Defaults to 0.

xAxis: {
    type: 'datetime',
    dateTimeLabelFormats: {
        month: '%e. %b',
        year: '%b'
    },
    tickInterval: 24 * 3600 * 1000,
    tickWidth: 1,
    minPadding: 0.5,
    maxPadding: 0.5                
}

Padding datetime axis @ jsFiddle