How to render events on different row in React-big-calender day and week view?

Viewed 614

I am using react-big-calendar to render events, and I using month,week,days view. Everything works fine in month view, but if there are multiple events with same time slots then it would render in a single row(ref image below). Is there any way to render the event column-wise? Also, are there any good alternatives to react-big-calendar?

week view

day view

month view

1 Answers

Unfortunately, the documentation site is out of date, or you'd know about the new dayLayoutAlgorithm prop. From the updated documentation (available by cloning the repo and running the 'examples'):

dayLayoutAlgorithm

A day event layout(arrangement) algorithm.

overlap allows events to be overlapped.

no-overlap resizes events to avoid overlap.

or custom `Function(events, minimumStartDifference, slotMetrics, accessors)

type: custom

default: overlap

Related