# Horizontal calendar / occupancy planner

**URL:** https://forum.djangoproject.com/t/horizontal-calendar-occupancy-planner/29874
**Category:** Templates & Frontend
**Created:** [April 5, 2024, 1:14pm UTC](https://forum.djangoproject.com/t/horizontal-calendar-occupancy-planner/29874 "2024-04-05T13:14:18Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![PLR06157](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/plr06157/32/14716_2.png) [@PLR06157](https://forum.djangoproject.com/u/PLR06157)
#### Post date: [April 5, 2024, 1:14pm UTC](https://forum.djangoproject.com/t/horizontal-calendar-occupancy-planner/29874/1 "2024-04-05T13:14:18Z")

</div>

Hey good people!

I’m trying to build an occupancy planner with view as a vertical calendar (see below Excel screen shot with visualisation).

I have build most of the basic back-end functionalities in Django, however now I’m struggling in finding a way to have this view presented on a webpage of the application.

Can anyone guide me what might be the good approach to achieve this? Should I look into combing plotly into Django? Or you have seen any good solution of something similar in JavaScript or something?

Or maybe having this done from Django is an overkill?

Any help will be much appreciated.

 ![Screenshot 2024-04-05 at 15.08.59](https://us1.discourse-cdn.com/flex026/uploads/djangoproject/original/3X/6/4/64b017a2b1d6bd1cba30ac7754687d117a583b05.png)

---

<div class="post-metadata">

### Author: ![KenWhitesell](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/kenwhitesell/32/280_2.png) [@KenWhitesell](https://forum.djangoproject.com/u/KenWhitesell)
#### Post date: [April 5, 2024, 4:18pm UTC](https://forum.djangoproject.com/t/horizontal-calendar-occupancy-planner/29874/2 "2024-04-05T16:18:30Z")

</div>

> [@PLR06157](#):
>
> Can anyone guide me what might be the good approach to achieve this?

Any of the above. You can do this using something like D3.js or Chart.js, or you can render this directly as html in Django.

Part of what is going to drive this decision will depend upon the exact UI / UX you want to create.

For example, if you’re fine with a purely static HTML rendering, where the only UI features are perhaps a set of scroll bars, then a pure Django implementation may be fine. But, if you’re looking for something more like a spreadsheet-style interface, with dynamic row and column headers - and even the possibility of an “infinite scroll”-type solution, then you will want to mix in some JavaScript.

But you should define exactly how you want this to appear and be manipulated in the browser before finding the libraries or approach for implementation.  
(Note: It’s _not_ wrong to work in the other direction as well. You might want to look at some libraries and samples to see if you can find something close to what you want, and _then_ decide whether you can make _that_ library work for you.)