CODEWITHSUNDEEP
highcharts
leon
leon

Reputation: 10395

How do I setup Individual Column color for each Column (HighStock/HighChart)

Please have a look at this

I am trying to create a column chart using Highstock. I want to specify the color for each individual column. I tried everything I can but couldn't get it to work.

Can someone advise please?

Thanks a lot

$(function () {
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=range.json&callback=?', function(data) {

    window.chart = new Highcharts.StockChart({

        chart: {
            renderTo: 'container',
            type: 'columnrange'
        },

        rangeSelector: {
            selected: 2
        },

        title: {
            text: 'Temperature variation by day'
        },

        tooltip: {
            valueSuffix: '°C'
        },

        series: [{
            name: 'Temperatures',
            data: data
        }]

    });
});

});

Upvotes: 2

Views: 1627

Answers (2)

Sebastian Bochan
Sebastian Bochan

Reputation: 37578

In case when you would like to change color of column, you should set color parameter. 

plotOptions: {
        column: {
            color:'red'
        }
    },

http://jsfiddle.net/nQ8GL/1/

Upvotes: 0

cubbuk
cubbuk

Reputation: 7920

Seems like when marker is used color attribute of point is ignored by highcharts. Just put the color option inside marker if you set the marker attribute of the point. If you don't set the marker, just set color attribute as you already did in your example.

Here is a working example:

http://jsfiddle.net/nQ8GL/

Upvotes: 1

Related Questions