CODEWITHSUNDEEP
javascripthighchartshighcharts-gantt
Fabian Bigler
Fabian Bigler

Reputation: 10895

How can I change the color of legend points?

If you have a look at the example below the points of Project 1 and Project 2 are both grey in the Legend. However, in my case these points should have the same color as the related series. Is there some easy way to achieve this? I could not find any example.

Example: https://jsfiddle.net/0rdwm1ax/

//possibly relevant code:
series: [
     name: 'Test Series',
     color: '#00FF00' //Setting color in my project did not work, though
     ...
    ]

What I have already tried:

Upvotes: 1

Views: 450

Answers (1)

ppotaczek
ppotaczek

Reputation: 39069

It is the same situation as here: http://jsfiddle.net/BlackLabel/1w0yx8m4/

In gantt chart the colorByPoint option is enabled by default, so you can disable it: https://jsfiddle.net/BlackLabel/mdbqnaxy/ or add the below plugin to change the color for item.

(function(H) {
    var colors = ['red', 'blue'];

    H.wrap(H.Legend.prototype, 'colorizeItem', function(proceed, item) {
        item.color = colors[item.index];
        proceed.apply(this, Array.prototype.slice.call(arguments, 1));
        item.color = null;
    });
}(Highcharts));

Live demo: https://jsfiddle.net/BlackLabel/mjock9uw/

Docs: https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

Upvotes: 3

Related Questions