I'm using fullcalendar to show events from a JSON string. There are two separate events over the same time period. As seen from the screenshot half way down the rendering swaps sides.
How I can avoid it?
Your events should have an ID. Sort the events by ID, and they should display correctly.
Ends up to resolve the issue if there are multiple events colliding on the same timeslot, i just add 1 second to the time and it renders them correctly. No matter what I did with the ID's it didn't work.
Related
Is it possible to show the events one below the other like the image?i want view week with events vertical order
sorry my English is not perfet
No, it is not possible without editing the source code of fullcalendar.
The best you can do is set eventOverlap: false so that users at least cannot drag and drop the events to have the same time.
You can also try fullcalendar's scheduler plugin which will do almost the same. Search the documentation for vertical resources layout.
I have a fullCalendar plugin connected to Google Calendar and it shows all days, including days that don't have an event. I need it to show just days with an event. Is it possible?
I can't give a full answer since I am still chewing on this myself, but you might has well know what I've done. I work in a custom basic Day view called vertWeek, which looks like an agenda view. In dayRender, I have tried looping (.each) over fc-row and using freight trains of .has and .hasClass to try to hunt down those rows that have a td cell with .fc-container-event. The existence of this should be enough but no matter what I try I can't isolate a specific day-row. All rows get a green border or in the negative they get a red border.
I know my each works coz if I use .html on the index each row prints out its index number neatly. I don't have code handy, am away and tired, but go look for a post about squishing box calendar rows without events in them to get a gist of my efforts.
Hope this helps.
I want to make three changes to the fullcalendar Agenda view.
Remove start time from events, essentially I just want to display the title in each slot.
Change the height of timeslots, I have tried adjusting the contentHeight but that had no apparent effect.
Show 30min slots on Y-axis, I know about axisFormat option but it still only displays the full hours.
If anyone can give me any suggestions on how to accomplish these 3 changes?
Fullcalendar have rich callback set to configure:
You should use eventRender to modify it (hide title in already constructed is best way of it). Do not try construct new element and replace original
The same eventRender where you can add CSS or class and then change per event or direct from CSS
Agenda view does not have time slots at all, it is time-ordered list which does not represent proportion of time-lenght between events. If you wan't time based view, then try singe day view and set slotDuration as close as you want, even on the fly with buttons or keybind. + when setting slotDuration, if you wan't support adding events, change also snapDuration
I'm populating a number of calendars in Google Calendar via dynamically generated iCalendar feeds. These calendars are being correctly imported into Google Calendar, but their events appear intermixed as shown below:
Is there a way I can modify the iCal feed to encourage Google to render a single calendar in a single vertical column? It gets confusing when viewing our 12-13 calendars!
I don't believe that there is a way to change this. The layout is based on the starting time of events, and does not care from where the event was imported.
Although not entirely as per your question, you could change something inconsequential like the seconds of the start date of the event. For example, all items in your first feed start with the seconds set to :01, all items in your second feed start with the seconds set to :02 etc. This will not help you when you have an item in the second feed but nothing in the first feed, but should ensure that when you have two items with the same nominal start time the items are ordered correctly in the calendar.
I am working on a fullcalendar, and trying to differentiate the events next to each other. What I am thinking about doing is using two colors and fill in the events one next to it, so no neighbor events have the same color.
I am not sure how to do this, anyone has experience please share some idea=)
How are you trying to do this at the moment?
You will need to set the event td(I presume your using a table) to active, then possibly use nth-child