naaooj
Posts: 2
Joined: Mon Jan 15, 2018 11:51 am

Waterfall over years with scrolling

Hi everyone,

I need to create a waterfall chart with a distribution over years. You can find what it should look like in this https://jsfiddle.net/6j4x9qxt/.

My issue is that with more and more years it will not be displayed properly. But our endusers want a chart pictured this way. I hoped I could use Highstock to get an horizontal scrollbar, but unfortunately this type of series is not supported. Do you think it will be feasible to address this requirement without Highstock? Does any of you have an alternative in mind?

Thank you in advance for any support.

Regards,
Johann.
ppotaczek
Posts: 751
Joined: Mon Oct 02, 2017 3:12 pm

Re: Waterfall over years with scrolling

Hi naaooj,

Use only highstock.js source code to make a scrollbar available.
If you want to always have column element in the middle of category, turn off grouping.

Code: Select all

  plotOptions: {
    series: {
      grouping: false
    }
  },
Live demo: https://jsfiddle.net/ppotaczek/443bhg9r/
API Reference: https://api.highcharts.com/highcharts/p ... l.grouping

Best regards!
Paweł Potaczek,
Highcharts Developer
naaooj
Posts: 2
Joined: Mon Jan 15, 2018 11:51 am

Re: Waterfall over years with scrolling

Hello ppotaczek,

Thank you very much for the hint and the jsfiddle! :D

Your solution works perfectly and as expected, using the right min/max on the xAxis.

Regards,
Johann.
DineshSymp
Posts: 2
Joined: Wed Aug 30, 2023 5:35 am

Re: Waterfall over years with scrolling

Hi ,

If the waterfall data becomes huge then the scrollbar drag and drop not working, if it less it is working.

Anything needs to be configured?

Thanks,
Dinesh
jakub.j
Posts: 1084
Joined: Tue Jan 24, 2023 11:14 am

Re: Waterfall over years with scrolling

Welcome to our forum and thanks for contacting us with your question!

It is hard to tell you what is not working and what could be done without taking a look at your code.
Could you reproduce the issue in an online editor that I could work on?

You can base on this jsFiddle demo: https://jsfiddle.net/gh/get/library/pur ... /waterfall

Kind regards
Jakub
Jakub
Highcharts Developer
DineshSymp
Posts: 2
Joined: Wed Aug 30, 2023 5:35 am

Re: Waterfall over years with scrolling

Hi Jakub,

I have enabled the scrollbar in X axis line but not showing. However if show sometimes it got struck I cant click and drag or drop after update the data.

https://jsfiddle.net/xpa9j3w4/1/

Thanks,
Dinesh
jakub.j
Posts: 1084
Joined: Tue Jan 24, 2023 11:14 am

Re: Waterfall over years with scrolling

Hey!

You shouldn't import both highcharts and highstock at the same time, that's why was breaking, see:

Demo: https://jsfiddle.net/BlackLabel/27cnoxqm/

Let me know if you have any further questions!
Kind regards
Jakub
Jakub
Highcharts Developer

Return to “Highcharts Stock”