score:2

Accepted answer

This is general idea: http://jsfiddle.net/wFpey/

So split data into series according to name. Then create array of points, where each point is object or array (my example is array).

var series = [ {
    name: "T1",
    data: [
        [1364774400000, 13918927], [1364974400000, 13918927]
    ],
    color: "red"
}, {
    name: "T2",
    data: [
        [1364774400000,10920462], [1364974400000, 13918927]
    ],
    color: "green"
}, {
    name: "T3",
    data: [
        [1364774400000, 12312312], [1364974400000, 13918927]
    ],
    color: "blue"
}, {
    name: "T4",
    data: [
        [1364774400000, 12311111], [1364974400000, 13918927]
    ],
    color: "yellow"
}, {
    name: "T5",
    data: [
        [1364774400000, 11233345], [1364974400000, 13918927]
    ],
    color: "gray"
}, {
    name: "T6",
    data: [
        [1364774400000, 14322311]
    ],
    color: "black"
}];

score:0

Without seeing how your data is coming in, I can only get you so far, but take a look at this. The two keys here are the spacing between series points, taken care of in the plotOptions section, and defining categories on the xAxis to be grouped in. Fiddle

$(function() {

var data =
[
/* Apr 2013 */
{name:"T1",x:1364774400000, y:13918927, color:"red"},
{name:"T1",x:1364774400000, y:10920462, color:"green"},
[1364860800000,18920462],
[1364947200000,12971961],
/* May 2013 */
[1367366400000,18112671],
[1367452800000,15072312]
];
    /*$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-      v.json&callback=?', function(data) {*/

    // create the chart
    $('#container').highcharts('StockChart', {
        chart: {
            alignTicks: false,
            type: 'column'
        },

        plotOptions: {
        series: {
            pointPadding: 0,
            groupPadding: 0,
            borderWidth: 0, 
            shadow: false
            }
        },
        rangeSelector: {
            selected: 1
        },

        title: {
            text: 'AAPL Stock Volume'
        },

        series: [{
            name: 'AAPL Stock Volume',
            data: data
        }],
        xAxis: {
            categories: ['Apr 2013', 'May 2013'] ///needs to be specific to your data, this is just an idea not knowing your data
        },
    });
//});
});

EDIT: saw your data up top after, needs some tweaking a bit, but I hope you get the idea


Related Articles