CODEWITHSUNDEEP
highcharts
Stig Eide
Stig Eide

Reputation: 1062

Change colors on data points

If I have a data series like this:

series: [{
    name: 'Data',
        keys: ['label', 'x', 'y', 'z', 'colorA', 'colorB', 'left', 'top'],
    data: data
    }]

I would like to change all the points color from colorA to colorB like this:

chart.series[0].setColor(data.colorB);

Data is an array and looks like this:

var data =[['Danish',0.12861975,0.13658875,0.06524175,
'#0000FF','green','https://urltoanimage',91,17]]

So, for this one point, #0000FF is used as a color. I would like to change it to green.

Entire project is here: https://jsbin.com/xumofu/

Upvotes: 0

Views: 119

Answers (1)

ppotaczek
ppotaczek

Reputation: 39069

You need to update each point's color insted of series color, example:

document.getElementById('ColorA').addEventListener('click', function() {
    chart.series[0].points.forEach(function(point){
        point.update({ color: point.colorA }, false);
    });

    chart.redraw();
});

Live demo: http://jsfiddle.net/BlackLabel/bauvco71/

API Reference: https://api.highcharts.com/class-reference/Highcharts.Point#update

Upvotes: 2

Related Questions