I could make a two months with a timeline layout custom view using this code :
const views: IViewItem[] = [
{ id: "day", label: "Day", layout: "day" },
{ id: "week", label: "Week", layout: "week" },
{ id: "month", label: "Month", layout: "month" },
{
id: "2months",
label: "2 Months",
layout: "timeline",
config: {
step: [1, "day"],
getBounds: (date: Date) => {
const start = new Date(date.getFullYear(), date.getMonth(), 1);
const end = new Date(date.getFullYear(), date.getMonth() + 2, 0);
return [start, end] as [Date, Date];
},
getNext: (date: Date) => new Date(date.getFullYear(), date.getMonth() + 2, 1),
getPrev: (date: Date) => new Date(date.getFullYear(), date.getMonth() - 2, 1),
dateTitle: (_: Date, bounds: [Date, Date]) => {
const opts = { month: "short", year: "numeric" } as const;
return `${bounds[0].toLocaleDateString(undefined, opts)} — ${bounds[1].toLocaleDateString(
undefined,
opts
)}`;
},
},
},
];
const calendar = new EventCalendar(containerRef.current, {
mode: "month",
date: selectedDate,
events: data,
config: { views },
});
I don’t need any groupement by sections on it. As you see I’m not passing any config.sections but I’m still getting them in my calendar : https://i.imgur.com/v6k05AZ.png
I was using the syncfusion calendar before and that was possible as you can see : https://i.imgur.com/NV7VQuP.png