How do i enable hover tooltip to show detail of the events in streamlit-calendar (fullcalender)?

80 Views Asked by At

i am developing a streamlit dashboard to show events in the calendar. I achieved it, however i want to add a tooltip when hover over the event. i don't know how and most of the solutions are in js which offcourse i have no idea about it. Could some please help by adding the respective code to mine. I'm using open source streamlit-calendar which was built on top of fullCalendar.

https://pypi.org/project/streamlit-calendar/

def calendar_data_event(df):
    result = {
        "title": df['Title'],
        "start": str(df['AssessmentDueDate']),  # Convert timestamp to string
        "end": str(df['AssessmentDueDate']),    # Convert timestamp to string
        "Regulator": df['Regulator'],
        "updatedDB_Date": str(df['updatedDB_Date']),
        "AssessmentDueDate": str(df['AssessmentDueDate']),
        "ApplicationDate": str(df['ApplicationDate']),
        "ImpactRating": df['ImpactRating'],
        "ImpactScore" : df['ImpactScore'],
    }
    return result


calendar_options = {
        "editable": "true",
        "selectable": "true",
        "headerToolbar": {
            "left": "today prev,next",
            "center": "title",
            "right": "dayGridDay,dayGridWeek,dayGridMonth",
        },
        "initialView": "dayGridMonth",
    }


calendar_events = [calendar_data_event(row) for _, row in df.iterrows()]
    
custom_css="""
        .fc-event-past {
            opacity: 0.8;
        }
        .fc-event-time {
            display: none;
        }
        .fc-event-title {
            font-weight: 700;
        }
        .fc-toolbar-title {
            font-size: 2rem;
        }
        
    """

calendar = calendar(events=calendar_events, options=calendar_options,custom_css=custom_css,callbacks = [])                     
st.write(calendar)
0

There are 0 best solutions below