Click here to Skip to main content
14,700,041 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi, I have 2 series in my highchart. Series1 and Series2. Upon hitting a condition, their color will change to red. I have successfully done for the Series2 but somehow I cant change the color os Series1 also. Below are my codes:

$('#myDiv').highcharts({
//logics here
            }, function (chart) {
                var max = 80;

                $.each(chart.series[2].data, function (i, data) {
                    if (data.y < max) {
                        data.graphic.attr({
                            fill: 'RED'
                        });
                        chart.series[0].data[0].update({
                            marker: {
                                fillColor: 'RED'
                            }
                        });
                    }
                });
            });



As shown on the codes, there is no problem in series[2] data/color changing but when I want to change the color for series[1], it would not allow me to.
FYI, the color of the series[1] will change depends on the value of series[2], if series[2] changes color, then series[1] will follow suits.

What I have tried:

chart.series[1].data.graphic.attr({
fill: 'RED'
});
Posted
Updated 30-Jun-16 21:09pm
v3

1 solution

   
Comments
Jamie888 1-Jul-16 2:06am
   
Sir, I have changed the codes into:
chart.series[0].data[i].update({
marker: {
fillColor: 'RED'
}
});
But the color still have not change.
Karthik_Mahalingam 1-Jul-16 2:06am
   
Could you post the full code
Jamie888 1-Jul-16 2:10am
   
Sir, script updated.
Jamie888 1-Jul-16 2:14am
   
Sir, I have found the solution for this. I have removed the:
chart.series[0].data[0].update({
marker: {
fillColor: 'RED'
}
});

into:
chart.series[0].data[i].graphic.attr({ fill: 'RED' });
chart.redraw();
Jamie888 1-Jul-16 2:16am
   
But one thing though, is it a highchart bug that when i hover the point/column with RED, it will get change back to its original color and would not revert back to RED even I hover out the point?
Karthik_Mahalingam 1-Jul-16 2:38am
   
then you will have to write code for hover also
Highcharts Demo - JSFiddle[^]



hover: {
fillColor: 'red',
lineColor: 'red'
}
Jamie888 1-Jul-16 2:42am
   
I have change the codes as without the 'states:':
chart.series[0].data[i].graphic.attr({ fill: 'RED' });
hover: { fillColor: 'RED' };
chart.redraw();

But the result is the same.
Karthik_Mahalingam 1-Jul-16 3:02am
   
ok i will check

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900