FullCalendar 4 inverse-background - fullcalendar-4

Question

I have problem with Inverse Backgrounds in FullCalendar v4.0.2.
code:
let calendarEl = document.getElementById(this.element_id);
this.calendar = new FullCalendar.Calendar(calendarEl, {
plugins: [ 'timeGrid' ],
height: "auto",
nowIndicator : true,
defaultView: 'timeGridDay',
events: [
{
id: 2,
start: '2019-04-17 10:00:00',
end: '2019-04-17 11:00:00',
color: 'blue',
rendering: 'inverse-background'
} , {
id: 2,
start: '2019-04-17 14:00:00',
end: '2019-04-17 15:00:00',
color: 'green',
rendering: 'inverse-background'
}
]
});
this.calendar.render();
when i use this code events that share the same id wouldn't grouped together when this rendering happens.

Answer 1

I'm not entirely sure but I think you're using the wrong view for that type of rendering.
const el = document.querySelector("#calendar");
const calendar = new FullCalendar.Calendar(el, {
plugins: ['timeGrid'],
defaultView: 'timeGridWeek',
events: [
{
id: 2,
start: '2019-04-17 10:00:00',
end: '2019-04-17 11:00:00',
color: 'blue',
rendering: 'inverse-background'
} , {
id: 2,
start: '2019-04-17 14:00:00',
end: '2019-04-17 15:00:00',
color: 'blue',
rendering: 'inverse-background'
}
]
});
calendar.render();
https://codepen.io/anon/pen/rbJyzv 👀