artakserkses
Posts: 13
Joined: Tue Feb 23, 2021 11:23 am

two gantts on one chart

Tue Feb 23, 2021 11:28 am

Hello to everyone,
Can you tell me how should i properly insert two gantts one under another in one chart? I tried like here:

https://stackblitz.com/edit/highcharts- ... mponent.ts

But it is overlapping, and everything looks ... bad.

Or maybe is it possible to have two charts with one navigator? So i could do two separate charts in separate divs and on the bottom navigator. I'm trying to achive something like this, but with gantt:

https://jsfiddle.net/gh/get/library/pur ... ll-plugin/

Thanks for answers

User avatar
sebastian.h
Posts: 779
Joined: Fri Aug 07, 2020 7:08 am

Re: two gantts on one chart

Wed Feb 24, 2021 10:19 am

Hi,

In this case, you can add a second series, but you won't get the effect with the highstock chart.
https://jsfiddle.net/BlackLabel/72t16u4s/

Another option is to use xrange type chart that resembles a Gantt, you have to adjust it for your goal.
https://jsfiddle.net/BlackLabel/xkv6n93y/

Would you like to sync these charts or only display the data?

I'm waiting for news from you.
Best regards.
Sebastian Hajdus
Highcharts Developer

artakserkses
Posts: 13
Joined: Tue Feb 23, 2021 11:23 am

Re: two gantts on one chart

Thu Feb 25, 2021 8:45 pm

Thanks for answer,
I would like them to sync in Navigator.
Or maybe there is a simple way to make navigator outside a chart? (ex. in some other component?) so I could make two charts, in separate divs, and one navigator on the bottom?

Ofcorse i will check this x-range series, cause it seems ... interesting :)

User avatar
sebastian.h
Posts: 779
Joined: Fri Aug 07, 2020 7:08 am

Re: two gantts on one chart

Fri Feb 26, 2021 1:33 pm

Hi,

It's possible to show two series in one navigator, here is a solution.
Regarding two charts in a separate div, this looks like a more complicated approach, but maybe you can get what you want.

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

API References:
https://api.highcharts.com/gantt/navigator

Let me know if that was what you were looking for.
Best regards.
Sebastian Hajdus
Highcharts Developer

artakserkses
Posts: 13
Joined: Tue Feb 23, 2021 11:23 am

Re: two gantts on one chart

Mon Mar 01, 2021 1:09 pm

sebastian.h wrote:
Fri Feb 26, 2021 1:33 pm
Hi,

It's possible to show two series in one navigator, here is a solution.
Regarding two charts in a separate div, this looks like a more complicated approach, but maybe you can get what you want.

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

API References:
https://api.highcharts.com/gantt/navigator

Let me know if that was what you were looking for.
Best regards.
Not quite.
My issue is that I want to move elements from one chart to other, and to have possibility of y-scrolling charts independent. And with two series if you have lots of data you cannot scroll one of series indepentent from other.

User avatar
sebastian.h
Posts: 779
Joined: Fri Aug 07, 2020 7:08 am

Re: two gantts on one chart

Tue Mar 02, 2021 9:24 am

Hi,
Thanks for more details.

Do you mean the charts shown like this?
https://jsfiddle.net/BlackLabel/9ondh4uz/
Moving points from one chart to another will require writing custom code, there are no such options in the basic documentation.

This is an example of sync, do you want to combine it like this?
https://jsfiddle.net/2ehxvo8s/

Best regards.
Sebastian Hajdus
Highcharts Developer

artakserkses
Posts: 13
Joined: Tue Feb 23, 2021 11:23 am

Re: two gantts on one chart

Wed Mar 03, 2021 8:38 am

Yeah, thats what i need :)
Thx :)

User avatar
sebastian.h
Posts: 779
Joined: Fri Aug 07, 2020 7:08 am

Re: two gantts on one chart

Wed Mar 03, 2021 9:33 am

You're welcome!
In case of any further questions, feel free to contact us again.
Sebastian Hajdus
Highcharts Developer

Return to “Highcharts Gantt”