Dear Forum,
anybody has an idea if and possibly how it is possible to display a timeline view that exceeds the duration of one year?
Currently "TimelineYear" view, but that is limited to a single year.
We need to show a timeline with an individual timeframe e.g. last 3 months until end of the following year.
Is there any option to specify a custom timeframe for a timeline?
Any help is appreciated, thanks a lot in advance!
Hi Kris,
Based, on your shared details we suspect that your requirement is to render each year until the following year third month. You can achieve this requirement by using the Schedule’s firstMonthOfYear and monthsCount property, as shown in the below snippet.
Api: https://ej2.syncfusion.com/vue/documentation/api/schedule/#firstmonthofyear
https://ej2.syncfusion.com/vue/documentation/api/schedule/#monthscount
Demo: https://ej2.syncfusion.com/react/demos/#/bootstrap5/schedule/year
[App.vue]
<template> <div id='app'> <ejs-schedule :firstMonthOfYear="firstMonthOfYear" :monthsCount="monthsCount"> <e-views> <e-view option='TimelineYear'></e-view> </e-views> </ejs-schedule> </div> </template> <script> export default { data() { return { firstMonthOfYear: 0, monthsCount:15, }; </script> |
Regards,
Swathi Ravi
Thanks a lot Swathi,
the information was very useful and helped me find a solution.
Note for others:
the value of "firstMonthOfYear" can also be a negative number, allowing to start also in the previous yet with the Schedule.
@Swathi: one follow up question:
Is there a similar option for the TimelineMonth view?
Some setting that would allow to extend the TimelineMonth view to also display a longer period than just one month.
Client just likes the layout of the Month view better than TimelineYear view and thus would like to display longer period.
Hi Kris,
You can extend the display of the default number of months on the TimelineMonth view by setting the interval for the TimelineMonth option within the "views" property, as depicted in the following code.
<e-view option="TimelineMonth" interval="5"></e-view>
https://helpej2.syncfusion.com/vue/documentation/schedule/views#extending-view-intervals
Regards,
Vinitha