Gantt chart should show overlapping tasks #127

Open
opened 2025-11-01 20:48:01 -05:00 by GiteaMirror · 9 comments
Owner

Originally created by @Lukse on GitHub (Feb 19, 2023).

Description

Current behavior is has incorrect date filter. Now it checks if task only start date is in the selected date range, but should check if task date (from start till the end) intersects with the selected date range.

Problem: Gantt chart is not displaying tasks that should be visible.

Vikunja Frontend Version

0.20.3

Vikunja API Version

0.20.1

Browser and version

All

Can you reproduce the bug on the Vikunja demo site?

Yes

Screenshots

Easy to miss most of the tasks:
01_how_it_works_now

This is how chart should look like (without selecting extended date range)
02_what_is_expected

Originally created by @Lukse on GitHub (Feb 19, 2023). ### Description Current behavior is has incorrect date filter. Now it checks if task only **start date** is in the selected date range, but should check if task date (from **start till the end**) intersects with the selected date range. Problem: Gantt chart is not displaying tasks that should be visible. ### Vikunja Frontend Version 0.20.3 ### Vikunja API Version 0.20.1 ### Browser and version All ### Can you reproduce the bug on the Vikunja demo site? Yes ### Screenshots Easy to miss most of the tasks: ![01_how_it_works_now](https://user-images.githubusercontent.com/1157271/219934198-99cd43ce-8c64-46bb-8e9b-5fbcb07dc559.png) This is how chart should look like (without selecting extended date range) ![02_what_is_expected](https://user-images.githubusercontent.com/1157271/219934202-f443f0bf-96f2-41ea-8a43-ca489a34451a.png)
GiteaMirror added the area/gantt label 2025-11-01 20:48:01 -05:00
Author
Owner

@kolaente commented on GitHub (Feb 20, 2023):

So the tasks which start or end outside the currently selected range would be cut off at the edge of the chart? I'm not sure if that's possible with vue-ganttastic (the gantt library we're using) - @dpschen Do you know something about this?

@kolaente commented on GitHub (Feb 20, 2023): So the tasks which start or end outside the currently selected range would be cut off at the edge of the chart? I'm not sure if that's possible with vue-ganttastic (the gantt library we're using) - @dpschen Do you know something about this?
Author
Owner

@dpschen commented on GitHub (Feb 20, 2023):

We should probably think of what the best way to handle the UX here would be before do anything in a rush.

Regarding the kanban library:
As far as I know there is no dedicated functionality for this.

One thing that we could do is to create a computed list of modified tasks. We would need to display something different than what is shown (since start and end date could be different for tasks for the kanban library vs the actual task). Since we can provide additional props to the task object provided to the lib this is possible.

This would add a new problem: if the actual start date is outside the shown range can the user still drag the task? Can he modify the start date?

@dpschen commented on GitHub (Feb 20, 2023): We should probably think of what the best way to handle the UX here would be before do anything in a rush. Regarding the kanban library: As far as I know there is no dedicated functionality for this. One thing that we could do is to create a computed list of modified tasks. We would need to display something different than what is shown (since start and end date could be different for tasks for the kanban library vs the actual task). Since we can provide additional props to the task object provided to the lib this is possible. This would add a new problem: if the actual start date is outside the shown range can the user still drag the task? Can he modify the start date?
Author
Owner

@dpschen commented on GitHub (Feb 20, 2023):

Sry. Didn’t want to close… GitHub mobile interface is really bad designed.

@dpschen commented on GitHub (Feb 20, 2023): Sry. Didn’t want to close… GitHub mobile interface is really bad designed.
Author
Owner

@Lukse commented on GitHub (Feb 20, 2023):

Use the original task dates. Current functionality makes Gantt chart unreliable. I always have to guess if all tasks are in the chart (usually they are not). Alternative solution would be to show all the tasks in the category without date filter (maybe add another checkbox [ ] Show tasks outside selected date range).

gantt

@Lukse commented on GitHub (Feb 20, 2023): Use the original task dates. Current functionality makes Gantt chart unreliable. I always have to guess if all tasks are in the chart (usually they are not). Alternative solution would be to show all the tasks in the category without date filter (maybe add another checkbox ```[ ] Show tasks outside selected date range```). ![gantt](https://user-images.githubusercontent.com/1157271/220184649-3120e8c1-2a47-40fe-add8-6043cf6e47a1.jpeg)
Author
Owner

@dpschen commented on GitHub (Feb 21, 2023):

I just checked out the demos of the library. Seems like date ranges outside are supported: https://zunnzunn.github.io/vue-ganttastic/examples.html

@dpschen commented on GitHub (Feb 21, 2023): I just checked out the demos of the library. Seems like date ranges outside are supported: https://zunnzunn.github.io/vue-ganttastic/examples.html
Author
Owner

@avatar1024 commented on GitHub (May 15, 2025):

For me the issue is there only if the start date is outside the date range shown in the Gantt view. If only the end date is outside then it works well.

@avatar1024 commented on GitHub (May 15, 2025): For me the issue is there only if the start date is outside the date range shown in the Gantt view. If only the end date is outside then it works well.
Author
Owner

@Australis86 commented on GitHub (Jun 26, 2025):

I, too, would really like to be able to see tasks that intersect with the selected date period on the Gantt chart (especially if their start is outside the date range).

Currently running v0.24.6.

@Australis86 commented on GitHub (Jun 26, 2025): I, too, would really like to be able to see tasks that intersect with the selected date period on the Gantt chart (especially if their start is outside the date range). Currently running v0.24.6.
Author
Owner

@dpschen commented on GitHub (Jun 26, 2025):

We are currently replacing the gantt library completely. There is a prototype implementation in https://github.com/go-vikunja/vikunja/pull/1001

Might be a completely different implement later, but there is progress for the gantt chart in general.

@kolaente does your implementation support this feature?

@dpschen commented on GitHub (Jun 26, 2025): We are currently replacing the gantt library completely. There is a prototype implementation in https://github.com/go-vikunja/vikunja/pull/1001 Might be a completely different implement later, but there is progress for the gantt chart in general. @kolaente does your implementation support this feature?
Author
Owner

@kolaente commented on GitHub (Jun 26, 2025):

@dpschen not yet, but I would like to integrate it at some point. First I'd like to get feature parity in the new implementation with the current Gantt chart and then make it better.

@kolaente commented on GitHub (Jun 26, 2025): @dpschen not yet, but I would like to integrate it at some point. First I'd like to get feature parity in the new implementation with the current Gantt chart and then make it better.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/vikunja#127