React-big-calendar: Multiple events at the same time

[zackify]

If multiple events are in the same time slot, only the top most one shows, and the others are rendered under it on the day view.

[tobiasandersen]

That sounds like a bug, but the examples page seems to be working. Can you post a screenshot, along with the events data?

[zackify]

I was thinking maybe its a css issue, but the percentages are all the same

[sandysandajan]

I also encountered the same issue that the events overlap when the time slots are the same. Awaiting for reply from the developers.

[jquense]

@zackify can use actually paste the cleaned events that cause the issue so we can copy it here? Or just put something together we can run

[zackify]

yeah ill try to make a little CRA demo soon

[jquense]

Thanks!

[zackify]

1. create-react-app cal
2. npm install react-big-calendar moment
3. Paste code below into App.js
4. npm start

```import React, { Component } from 'react';
import moment from 'moment';
import BigCalendar from 'react-big-calendar';
import 'react-big-calendar/lib/css/react-big-calendar.css';
BigCalendar.momentLocalizer(moment);

class App extends Component {
render() {
return (

popup
events={[
{
end: new Date('2017-12-27T21:45:00.000Z'),
patient_id: 1,
selectable: true,
start: new Date('2017-12-27T21:45:00.000Z'),
title: 'test',
},
{
end: new Date('2017-12-27T21:45:00.000Z'),
patient_id: 2,
selectable: true,
start: new Date('2017-12-27T21:45:00.000Z'),
title: 'test 2',
},
{
end: new Date('2017-12-27T21:45:00.000Z'),
patient_id: 3,
selectable: true,
start: new Date('2017-12-27T21:45:00.000Z'),
title: 'test 3',
},
]}
defaultView="agenda"
onSelectEvent={({ patient_id }) => console.log(patient_id)}
startAccessor="start"
/>

);
}
}

export default App;
```

Go to the day view for december 27. All events are right on top of each other.

@jquense

[zackify]

Oh by the way awesome work on this component, you all are great :)

[sandysandajan]

Do you have any update regarding this issue?

[jquense]

Nope I'm on vacation

[tobiasandersen]

I've fixed this on my local branch (along with some other stuff). I'll let you know once the PR is ready!

[sandysandajan]

@tobiasandersen what is the fix for this bug?

[smandell]

@tobiasandersen I'm dying to know what 'more google-like' means. Any chance you could post a before-after of day view so we could get a preview?

[tobiasandersen]

@smandell I think the visual changes should be quite subtle, but you can try for yourself now with https://github.com/intljusticemission/react-big-calendar/pull/677. It'd be really helpful if people could help testing with their own data and report back!

[jquense]

should be fix on master, gonna try and get a release out

[zackify]

Anyway you could post back here when it's released since it's fixed but not out?