Displaying Date Range as a Gantt Chart?

I have seen a few tutorials on displaying collection list as bar graphs. Does anyone know or can think of a way to display date ranges as a line on say a 24 month calendar. So if I have an item that will take 4 months to complete and I have 24 months I can plug in the dates and it shows the date range on the chart. This would basically be a gantt chart.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Does this project help? (all credit to @vincent)

https://webflow.com/website/CMS-Timeline-Template

That is very close to what I need. I will look through the setup and see how it is constructed. Thanks for the fast response.

1 Like

It will maybe inspire you but it’s not covering date ranges… and that’s on my list for a new project. Don’t know how I will tackle this.

Anyway, CSS Calc should be involved. You will also have to have seperate fields for day, months and year because in custom code you can only retrieve a full date format, and there’s no finer options.

JS could do it better than I did but as I don’t code js… If your date range thing is a serious project, you should consider js to retrieve dates components and to affect a different class to the Embed code component inside of col items. You’ll surely understand why when you start to investigate.

1 Like

Vincent,

This is a very impressive set up. Can you tell me how you came up with calculations in the custom code sections specifically the Event container. How did you get the number 78?

Thanks
Mike