Tengo problemas para mostrar eventos en mi calendario. Estoy tomando datos de un archivo events.json y agregando un evento. Muestra un día demasiado corto para mí. Por ejemplo, el evento 09.08-15.08 se muestra solo hasta el 14.08. 08.09-09.10 es correcto, 24.09-26.09 es demasiado corto 01.09-05.09 es demasiado corto, etc.

¿Por qué está pasando esto? ¿Y como arreglarlo?

Aquí hay una vista previa en vivo del problema: https://mawk.bieda.it/

Aquí está mi código:

 <script> document.addEventListener('DOMContentLoaded', function () { var calendarEl = document.getElementById('calendar'); var calendar = new FullCalendar.Calendar(calendarEl, { /*locale: 'pl',*/ firstDay: 1, headerToolbar: { left: 'prev,next today', center: 'title', right: 'prevYear,nextYear' }, validRange: { start: '2021-01-01', end: '2022-01-01' }, selectable: true, select: function (info) { alert('Selected ' + info.startStr + ' to ' + info.endStr); }, events: { url: '/events.json', extraParams: function () { return { cachebuster: new Date().valueOf() }; } }, }); calendar.render(); }); </script> <div id='calendar' style="height: 600px; width: 600px; margin: auto;"></div>

Este es evento.json:

 [ { "title": "09.08-15.08", "start": "2021-08-09", "end": "2021-08-15" }, { "title": "08.09-09.10", "start": "2021-09-08", "end": "2021-09-10" }, { "title": "24.09-26.09", "start": "2021-09-24", "end": "2021-09-26" }, { "title": "01.09-05.09", "start": "2021-09-01", "end": "2021-09-05" }, { "title": "28.09-03.10", "start": "2021-09-28", "end": "2021-10-03" }, { "title": "01.12-03.10", "start": "2021-12-01", "end": "2021-12-31" } ]