mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.56k stars 1.33k forks source link

[charts] Implement Gantt Chart #8732

Open joserodolfofreitas opened 1 year ago

joserodolfofreitas commented 1 year ago

Summary 💡

Gantt Chart implementation

Benchmarks

Public, read only: https://mui-org.notion.site/Gantt-Chart-component-e0014e4a55ae44fe901d575b1886e78e Internal, write & read: https://www.notion.so/mui-org/Gantt-Chart-component-e0014e4a55ae44fe901d575b1886e78e

Requests

MUI X Gantt chart

https://mui.com/x/react-charts/gantt/

flaviendelangle commented 1 year ago

@joserodolfofreitas would you agree to link it in the charts doc ?

joserodolfofreitas commented 1 year ago

Sure thing, @flaviendelangle!

flaviendelangle commented 1 year ago

Done in #8739

Onfire7 commented 1 year ago

I really need a Gantt chart that either has some table like features, or ideally, integrates into a table. It would be really cool if we could have a special table column that has sub columns for days and displays the as a Gantt chart. This way, we retain the ability to interact with the data in a table (Displaying important columns, editing, filtering, etc.)

flaviendelangle commented 1 year ago

Hi,

We don't have plan to create this component in the coming months. We are mainly focusing on the basic charts for now.

BritishGit commented 1 year ago

Appreciate the content being provided and look forward to when a Gannt chart becomes available.

hdngr commented 1 year ago

Looking forward to this!

alexfauquette commented 1 year ago

Thanks for your interest. Could you provide some information about what you are expecting from this component?

marcohaferkamp commented 1 year ago

Really looking forward to it. Here are some ideas / use cases / current requirements in our project:

Our hardest need would not be the large interactivity (maybe tooltips would be nice), but rather the display part - basically just show data. One of the biggest problems we currently have is the performance .

alexfauquette commented 1 year ago

Thanks for all those insights @marcohaferkamp

One of the biggest problems we currently have is the performance

Does your current solution support virtualization?

marcohaferkamp commented 1 year ago

We have built a custom solution on our own, and no it's not implemented.

salehsed commented 11 months ago

+1

itopaloglu83 commented 11 months ago

Resource timeline view would be great feature with the Gantt chart as well.

alexfauquette commented 11 months ago

@itopaloglu83 Would you have examples of nice resource timelines?

itopaloglu83 commented 11 months ago

Of course. Here's a quick list from simplest to more featured. And my rumblings below that.

https://fullcalendar.io/docs/timeline-view

image

https://www.airtable.com/platform/views

image

https://demo.mobiscroll.com/javascript/timeline/month-view

image

Event connections and dependencies. https://bryntum.com/products/scheduler/

image

Next one is my favorite because it allows users to manage complex relationships between events. https://bryntum.com/products/schedulerpro/ (includes a scheduling engine)

image

Rumblings: Gantt charts are very useful but when there are many projects involved then the main issue becomes the resource availability. Especially considering the fact that each task may require numerous resources. There are many great resource management solutions out there like ERPs etc. but they are all lacking a good user interface.

abdelrahmanes commented 10 months ago

looking forward to this chart component and I hope it supports direction RTL and to be responsive

alexfauquette commented 10 months ago

I hope it supports direction RTL

Hi @abdelrahmanes do you have some specific RTL modification of a gantt in mind? I assume the past/future direction is inverted. But other than that are there some tricky aspect we should be aware of?

abdelrahmanes commented 10 months ago

@alexfauquette Great, that's what I meant, that the axis labels and data bars to be inverted

To be more clear, I was using apex timeline chart and I used the inverted boolean property for the date labels to be inverted but it wasn't working

(Jan, Feb, March) should be (يناير، فبراير، مارس) But it was ( مارس، فبراير،يناير)

I hope I was clear enough

alexfauquette commented 10 months ago

Yes, make totally sens :+1:

MustBuildAdmin commented 9 months ago

Hi looking forward for this Gantt

I have some use cases for this Gantt

  1. calculating the critical path
  2. calculating the free and total float values for a task or subtask

https://docs.dhtmlx.com/gantt/samples/08_api/17_show_task_slack.html https://docs.dhtmlx.com/gantt/desktop__critical_path.html#gettingfreeandtotalslack https://snippet.dhtmlx.com/5/eb05a1f90?_ga=2.196660396.1883656908.1707371675-595900954.1707225801&_gl=1*zy3qdd*_ga*NTk1OTAwOTU0LjE3MDcyMjU4MDE.*_ga_N87XPB4GSG*MTcwNzM3MTY3NS4yLjEuMTcwNzM3MTczMi4zLjAuMA..

image image

sjacobi109 commented 8 months ago

Hi Guys, can't wait for this component! Drag and drop functionality for each task on the timeline, for both along the x and y axes, would be awesome. This would greatly improve user experience and flexibility within the chart.

HimanshuBari21 commented 8 months ago

Yes, make totally sens 👍

msavastio commented 6 months ago

I'm looking forward to this one - I currently use the Bryntum Scheduler and I "dislike it strongly" is how I will put it. My use case is basically render the Outlook calendar week view for employee time sheets where the horizontal axis is days of the week and the vertical axis is hours. Bryntum does let me do this in a kind of hacky way, so I will give them that. I have a feeling this kind of use case would be achieved in a more intuitive way using a component from you guys!

alexfauquette commented 6 months ago

@msavastio That does not look like a Gantt chart usage. It's more a Scheduler edge case

halsee commented 5 months ago

Really looking forward to this feature! My company builds software for construction, and gantt charts are used heavily throughout the industry.

goatrenterguy commented 5 months ago

Looking forward to this component. We currently use DHTMLX gantt and we are constantly fighting it. The primary reason we went with DHTMLX Gantt was the performance and the second is it lists as supporting a ton of features. As we continue to use it we realized all of the implementations are half thought out. Designing this chart to handle just the UI and input from the user would allow for a lot more flexibility when implementing it into a project.

JShawnLooney commented 4 months ago
gsbelarus commented 4 months ago

+1

benjaminfortunato commented 3 months ago

+1

ScottgArmstrong commented 1 month ago

When is Gantt chart planned for release? Is there a Beta or alpha version currently available?

JeissonB29 commented 1 month ago

Looking forward to this component. It's the only one I need that is not already included in MUI

benjaminfortunato commented 1 month ago

+1

alexfauquette commented 1 month ago

@ScottgArmstrong Not yet. The current state of discussion is about starting the effort during 2025

xylocodestack commented 1 month ago

i am also looking forward to this!

matsbryntse commented 1 month ago

I'm looking forward to this one - I currently use the Bryntum Scheduler and I "dislike it strongly" is how I will put it. My use case is basically render the Outlook calendar week view for employee time sheets where the horizontal axis is days of the week and the vertical axis is hours. Bryntum does let me do this in a kind of hacky way, so I will give them that. I have a feeling this kind of use case would be achieved in a more intuitive way using a component from you guys!

@msavastio Hi Matthew, curious to hear more about your negative experience (very rare for us to hear). I'd love to hear more about this, will send you an email to follow up. From your description it sounds like your trying to make the Scheduler be a Calendar. We have a separate Calendar product for this purpose, try taking it for a spin? https://bryntum.com/examples/calendar/ 📅

For anyone looking for a great Gantt chart with MUI, we're working on a new MUI theme for the Bryntum Gantt which should be ready first half of 2025. Something along the lines of https://bryntum.com/products/gantt/examples/custom-rendering/

/Mats (CEO, Bryntum)

ScottgArmstrong commented 1 month ago

I'm looking forward to this one - I currently use the Bryntum Scheduler and I "dislike it strongly" is how I will put it. My use case is basically render the Outlook calendar week view for employee time sheets where the horizontal axis is days of the week and the vertical axis is hours. Bryntum does let me do this in a kind of hacky way, so I will give them that. I have a feeling this kind of use case would be achieved in a more intuitive way using a component from you guys!

@msavastio Hi Matthew, curious to hear more about your negative experience (very rare for us to hear). I'd love to hear more about this, will send you an email to follow up. From your description it sounds like your trying to make the Scheduler be a Calendar. We have a separate Calendar product for this purpose, try taking it for a spin? https://bryntum.com/examples/calendar/ 📅

For anyone looking for a great Gantt chart with MUI, we're working on a new MUI theme for the Bryntum Gantt which should be ready first half of 2025. Something along the lines of https://bryntum.com/products/gantt/examples/custom-rendering/

/Mats (CEO, Bryntum)

How do you price it?

oliviertassinari commented 3 weeks ago

My use case is basically render the Outlook calendar week view for employee time sheets where the horizontal axis is days of the week and the vertical axis is hours.

@msavastio For this use case, I would imagine that it's more about #1407?