eraka
Posts: 123
Joined: Thu Apr 28, 2022 6:55 am

Assign a single color to two similar type

HI

Either I create a point or get data points from API , I want to give same color to every point which have same type?
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Assign a single color to two similar type

Hi there,

To achieve that simply write your own JS logic in chart.load event, and then loop over points and conditionally update some of them with Point.update method.

Take a look at the very basic Gantt example below, where I have created a simple logic that makes bars red if their ID equals 'planning' or 'develop'.

DEMO: https://jsfiddle.net/BlackLabel/zwcj2940/
API Reference: https://api.highcharts.com/class-refere ... int#update

I hope that you will find it useful,
Best regards!
Kamil Musiałowski
Highcharts Developer
eraka
Posts: 123
Joined: Thu Apr 28, 2022 6:55 am

Re: Assign a single color to two similar type

thanks

is this
const chart = this,
points = chart.series[0].points;

equivalent to
chartCallback: Highcharts.ChartCallbackFunction = (chart) => {
this.chartRef = chart;
};


actually i am not sure what this second expression is doing?
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Assign a single color to two similar type

Yes, I'm just grabbing the points array from the chart. So in your case, you simply can grab it from chartRef.
Kamil Musiałowski
Highcharts Developer
eraka
Posts: 123
Joined: Thu Apr 28, 2022 6:55 am

Re: Assign a single color to two similar type

ok getting ref is ok and by this wew can use update method, correct?

Is there any way that i can set
yAxis: {
type: 'category',
categories: this.arr,
min: 0,
max: temp
},

here for max i am setting temp as number with value 0 and in code i am reinitializing temp with temp =4 but its taking 0 is there any way i can set it
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Assign a single color to two similar type

Yes, you can use the update method there.

Just by looking at your yAxis config, everything seems to be fine, but I can't do much without looking at how the temp variable is created.
If you need further assistance in that matter, please recreate that issue in an online editor so I can take a look at it.
In the meantime, please study the xAxis.max API Reference to get a better understanding of how it is calculated in different scenarios.

API Reference: https://api.highcharts.com/highcharts/yAxis.max

Regards!
Kamil Musiałowski
Highcharts Developer
eraka
Posts: 123
Joined: Thu Apr 28, 2022 6:55 am

Re: Assign a single color to two similar type

hey i found solution..thanks!!
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Assign a single color to two similar type

That's great to hear that! Let me know if you need anything else.

Have a good day!
Kamil Musiałowski
Highcharts Developer

Return to “Highcharts Gantt”