Gantt Chart Pagination

How to achieve pagination in Gantt chart.Need quick help.


We have no built-in solution for solving this problem now.
How the pagination should works?
You could try to declare a filter or range from start_date to end_date and add required buttons to pages. Then set changing displayed range by pressing the button.


I have the same issue. I have a huge amount of data and when loading it on gantt chart, it takes a lot of time.

Is there a way to dynamically load the load the data( like, using page_start and page_end parameters for example ), when user scrolls?

There is no built-in pagination feature, but there are other things that might help you.
If you have a lot of tasks you can use smart rendering extension. In the following example gantt loads 30000 tasks within a few seconds: … ering.html
Also, if your projects have many tasks, there is an option that controls tasks tree, you can set it to false then load tasks:

gantt.config.open_tree_initially = false;


I’m trying to develop this type of functionality as well.

Is there a way to detect when the user has scrolled to the bottom of the grid (so I can initiate my “get more records” function)?

Thank you,


Hello Maurice,
There is no built-in option to check if Gantt was scrolled to the bottom of the page. It is possible to implement such a solution, although it may affect the performance.
After loading Gantt we get all task IDs. We connect smart rendering extension and detect all tasks on the screen each time you scroll Gantt. If the ID of the latest visible task matches with the latest task in the chart, then it is time to load new tasks. Please check the following snippet to see an example how it can be implemented:

For anyone who wants to see how to implement the pagination feature, here is the snippet: