lidorbt
Posts: 27
Joined: Tue Sep 08, 2020 4:32 am

Combined series in gantt - best practice

Hi everyone!
I'm trying to implement the latter view in my gantt but can't find the best practice to do that.

Image

*It's in hebrew, so in RTL. but I already know how to work with RTL, so you can ignore that case.

As for now, I have 2 solutions that I though of (but I'm ofc opened to new ones):

1. Using multiple serie arrays.
The main problem with that solution is that it's basically not the right way to use the data.
Another problem, is that it gives the same height to all the objects instead of calculating the height by the number of rows.

https://jsfiddle.net/rsf8yte2/7/

2. Using parenting and hierarchy.
Same as the last solution, it's also not the right way to use the data - but it's a lot closer.
Here, rows with the same 'description' are combined together (but it's still should not be in hierarchy).
The second problem is that there's a seperator between every object (on y-axis and on the chart itself) which I should remove.

https://jsfiddle.net/gh/get/library/pur ... o/subtasks

What's in your opinion is the best solution for that case?
Thanks in advance!
pawelys
Posts: 962
Joined: Wed Sep 02, 2020 10:37 am

Re: Combined series in gantt - best practice

Hello, thanks for contacting us with your question!
I don't quite understand what you mean by 'it's not the right way of using the data'. What is the right way?
Both solutions seem fine to what you are trying to achieve. Could you specify more thoroughly what are the pros and cons for them in your opinion apart from the way, they use the data?
Kind regards,
Paweł Lysy
Highcharts Developer
lidorbt
Posts: 27
Joined: Tue Sep 08, 2020 4:32 am

Re: Combined series in gantt - best practice

Hi pawelys!

Image

I'll try to explain my point by examples (I marked some important points on the picture above)

1. In this case, I'll have to create some arrays of data (which will be set on "series"). In this case, as highcharts is created - I'll have few arrays that are grouped due to their same name (i used propery uniqueNames: true) and that what makes it feasible.
You can see and example here:
https://jsfiddle.net/k9a54szw/

What I expected to have here, is a support of highcharts to get multiple arrays that look like that:
[A, B, C], [D], [E], [F, G]
That, as I see it, is the right way to work with the data. the problem is that I can't find anything that makes it feasible.

2. As I said at 1, the data isn't separated as it should be.
Here, I have to manipulate the data in a way that the first items (A, D, E, F) are parents of the rest.
That's basically is wrong, because they are more like "siblings". These items are combined together and that's it.
What could make it work better, is if I could disable the collapsing feature and make "opened". Same with removing the collapsing button.

Thanks in advance,
Hope I made my point more clear.
User avatar
sebastian.h
Posts: 1734
Joined: Fri Aug 07, 2020 7:08 am

Re: Combined series in gantt - best practice

Hi lidorbt,

Thanks for explantation.
I think an example of the subtasks is more similar to your goal.

Another solution for grouping tasks is to use breaks and translate points position.
https://jsfiddle.net/BlackLabel/e4kwpvby/

API References:
https://api.highcharts.com/highcharts/yAxis.breaks

Let me know if that was what you were looking for.
Best regards.
Sebastian Hajdus
Highcharts Developer
JayColon021
Posts: 5
Joined: Thu Dec 09, 2021 7:19 am

Re: Combined series in gantt - best practice

Hi sebastian.h,

First off ,apologies for replying to this old thread, but I have a somewhat similar requirement to the poster. Breaks and translating points from your example seem to work well for my requirement.
Another solution for grouping tasks is to use breaks and translate points position.
https://jsfiddle.net/BlackLabel/e4kwpvby/
However, I noticed that the tooltips were not properly aligned when points and data labels have been adjusted through the translate function. I've looked around the properties of points but could not find anything relating the tooltips positioning. Can you show me where to check?

Thanks,
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Combined series in gantt - best practice

Hi,

You can use the tooltip.positioner option to change the position of the tooltip.

Demo: https://jsfiddle.net/BlackLabel/ms39xLcd/
API: https://api.highcharts.com/gantt/tooltip.positioner

Let me know if that was what you were looking for!
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/

Return to “Highcharts Gantt”