Hiding gaps in tasks

Hi,

Take this gantt chart as example (I made the column width’s very small to make my question clearer). There are a lot of gaps in time where there are no tasks planned. Is it possible to hide these gaps?

Preferably I would like the areas marked with red to not be shown or be collapsable.

Below a screenshot of how my chart looks like normally. As you can see there is a lot of empty space.

Hello,
You can use the ignore_time function to hide the dates from the timeline:
https://docs.dhtmlx.com/gantt/desktop__custom_scale.html
In that function, you use the eachTask function to check all tasks:
https://docs.dhtmlx.com/gantt/api__gantt_eachtask.html
Inside that function, you check if the date is between the start_date or end_date of each task.
I didn’t test it with many tasks or a large scale, but I suppose, it might affect the performance because Gantt needs to check all tasks to see if the date should be hidden or not.
Here is an example of how it might be implemented:
http://snippet.dhtmlx.com/3bd095995

1 Like

Hey Ramil,

Thx again for the reply! I’ll try this one out tomorrow, I’ll let you know if how the performance is affected?

Hey Ramil,

I tried out your suggestion and it works very well. Performance wise I haven’t experienced any significant degradation.

I do have another question though. Do you know of a way show a visual indication that gantt is ignoring (not showing) columns? The way it is know I’m sure users won’t event notice that there is a gap in time.

I’m looking at creating marker right before and after gantt starts ignoring columns. If you have a different solution in mind I’d like to hear it!

Hello,
You can add vertical markers to show that there is a gap:
https://docs.dhtmlx.com/gantt/desktop__markers.html

Adding a marker for each hidden date will affect the performance, so it is nice to think about showing only the necessary markers. But I think it is not necessary to show the marker for the date when gap start and when it ends. You can show only when the gap starts. To do that, you check the condition for the previous day. Here is an example of how it might be implemented:
http://snippet.dhtmlx.com/889b20c27
If you need to display the start and end dates of gaps, you just need to add the condition for the next day. But visually it is not a nice-looking solution if you show the text:
http://snippet.dhtmlx.com/23eaea9ed