CODEWITHSUNDEEP
fullcalendar
ridgedale
ridgedale

Reputation: 190

Fullcalendar - Google Calendar Events Not Displaying

Reference: fullcalendar and gcal both v.3.9.0, jquery v.3.3.1, moment v. latest

I'm trying to get a test calendar running to display multiple Google Calendars, but so far no events are being displayed. I've followed the documentation on the fullcalendar.io website but have had no success so far. The following code renders the calendar but does not display the Google Calendar events:

$(document).ready(function() {

function CalendarSource(label, googleCalendarId, name) {
    this.label = label;
    this.googleCalendarId = googleCalendarId;
    this.name = name;
}

// Initialise the main calendar instance
$('#fullcalendar-instance').fullCalendar({
    googleCalendarApiKey: 'MyAPIkey',
    eventSources: [
        {
            googleCalendarId: 'gCalID-1',
            color: 'green',   // an option!
            textColor: 'black', // an option!
            className: 'my-event-1'
        },
        {
            googleCalendarId: 'gCalID-2',
            color: 'blue',   // an option!
            textColor: 'black', // an option!
            className: 'my-event-2'
        },
        {
            googleCalendarId: 'gCalID-3',
            color: 'orange',   // an option!
            textColor: 'black', // an option!
            className: 'my-event-3'
        }
    ],
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'prevYear,nextYear',
    },
    titleFormat: 'MMM YYYY',
    dayNamesShort: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
    bootstrapFontAwesome: {
        close: 'fa-times',
        prev: 'fa-angle-left',
        next: 'fa-angle-right',
        prevYear: 'fa-angle-double-left',
        nextYear: 'fa-angle-double-right'
    },
    timezone: 'Europe/London',
    defaultView: 'month',
    themeSystem: 'bootstrap4'
})

});

I would be grateful if someone could point out where I going wrong.

Upvotes: 0

Views: 452

Answers (1)

ridgedale
ridgedale

Reputation: 190

I rebuilt the page from scratch based upon the following demo: http://started%20from%20sratch%20using%20the%20fullcalendar.io/releases/fullcalendar/3.9.0/demos/gcal.html

Upvotes: 0

Related Questions