是否可以在一个Highcharts图表中合并两个柱形图？

Question

Highcharts supports combining different types of charts, eg combining a spline with a column in a single chart. And of course one can combine multiple splines in the same chart. Is it possible to combine multiple columns? Can I combine a column chart with a second column chart, ie to have one set of columns displayed on top (via zIndex) of another set of columns?

This fiddle -- http://jsfiddle.net/Bridgeland/rqrQ4/ --- shows the simplest possible example. I wanted to have a short squat yellow rectangle on top (zIndex) of a tall, skinny red rectangle, with the yellow rectangle covering up the bottom half of the red rectangle. Instead they appear side by side.

Is what I want possible in Highcharts?

(And as an aside, why does Highcharts cut the width of both columns in half? If the chart has only the series for the red rectangle, it is 5000 wide instead of 2500, and if the chart has only the series for the yellow rectangle, it is 10000 wide instead of 5000.)

Here's the code corresponding to the fiddle:

$(function () {
    $('#container').highcharts({
        chart: { 
            alignTicks: false
        },
        title: {
            text: ""
        },
        yAxis: {
            min: 0,
            max: 1
        },
        xAxis: {
            min: 0,
            endOnTick: false,  
            max: 9000
        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        series: [

        {
            data: [
            1],
            type: "column",
            pointPadding: 0.01,
            groupPadding: 0,
            color: "red",
            pointInterval: 5000,
            pointRange: 5000,
            borderWidth: 0,
            shadow: false,
            pointPlacement: "between",
            zIndex: 0,
            minPointLength: 3
        }, {
            data: [
            0.5],
            type: "column",
            pointPadding: 0.01,
            groupPadding: 0,
            color: "yellow",
            pointInterval: 10000,
            pointRange: 10000,
            borderWidth: 0,
            shadow: false,
            pointPlacement: "between",
            zIndex: 1,
            minPointLength: 3
        }]
    })
})

Answer 1

Remove groupPadding and set:

plotOptions: {
  series: {
    grouping: false
  }
}

And live example: http://jsfiddle.net/rqrQ4/1/