CODEWITHSUNDEEP
javascripthighcharts
user1471980
user1471980

Reputation: 10626

how do you change the color of cells in highcharts heatmap?

has anybody played around with the new highcharts library. This is the sample jsfiddle I am looking at:

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/maps/demo/heatmap/

Each cell color is blue, it needs to change based on the data in cells. I thought this line of code was supposed to do that. Any ideas how to change the color or each cell based on data. For example if we are working with data from 1 to 10. if the data in a cell is 1, the cell should be green colour if the data is 10 is should be read, based on the following options. Any ideas how to do this?

colorAxis: {
            stops: [
                [0,'green'],
                [0.5,'orange'],
                [0.9,'red']
            ],
            min: -20
        },

Upvotes: 0

Views: 3085

Answers (3)

Rikin Patel
Rikin Patel

Reputation: 9383

Use colors for list of colors,

In colorAxis declare dataClassColor as 'category' and define your data range in dataClasses

colors : ['#D7EDE5', '#9BD1BE', '#37A47E'],

colorAxis : {
    dataClassColor : 'category',
    dataClasses : [{
            to : 57.1
        }, {
            from : 57.2,
            to : 60.4
        }, {
            from : 60.5
        }
    ]
},

Demo http://jsfiddle.net/patelriki13/q2yww0vw/

Upvotes: 1

krupa
krupa

Reputation: 11

        stops: [

        [0, '#FF0000'],
       [1, '#00FF00'],
       [2, '#FFA500'],
       [3,'#FFFF00']

    ],
        min: 0,
        max: 1

This will give you the exact colours also in the series you need to give the json Object like this: {"x":0,"y":0,"value":0,"myData":"Critical"} The value is the attribute which gives exact colour

Upvotes: 1

Sebastian Bochan
Sebastian Bochan

Reputation: 37578

You need to use Highcharts 3.0.10, to set colours.

Upvotes: 0

Related Questions