Update app.py

app.py

@@ -5,6 +5,7 @@ import altair as alt
 import folium
 from folium.plugins import HeatMap, MarkerCluster
 from streamlit_folium import st_folium
+from streamlit_plotly_events import plotly_events
 
 @st.cache_data
 def load_and_preprocess_data(file_path):
@@ -23,9 +24,11 @@ def load_and_preprocess_data(file_path):
     for col in numeric:
         df[col].fillna(df[col].median(), inplace=True)
         
-    categorical = ['Gender_Drv1', 'Violation1_Drv1', 'AlcoholUse_Drv1', 'DrugUse_Drv1',
-                  'Gender_Drv2', 'Violation1_Drv2', 'AlcoholUse_Drv2', 'DrugUse_Drv2',
-                  'Unittype_Two', 'Traveldirection_Two', 'Unitaction_Two', 'CrossStreet']
+    categorical = [
+        'Gender_Drv1', 'Violation1_Drv1', 'AlcoholUse_Drv1', 'DrugUse_Drv1',
+        'Gender_Drv2', 'Violation1_Drv2', 'AlcoholUse_Drv2', 'DrugUse_Drv2',
+        'Unittype_Two', 'Traveldirection_Two', 'Unitaction_Two', 'CrossStreet'
+    ]
     for col in categorical:
         df[col].fillna('Unknown', inplace=True)
     
@@ -44,66 +47,53 @@ def load_and_preprocess_data(file_path):
     df['Age_Group_Drv1'] = pd.cut(df['Age_Drv1'], bins=bins, labels=labels)
     df['Age_Group_Drv2'] = pd.cut(df['Age_Drv2'], bins=bins, labels=labels)
     
+    if 'Weather' not in df.columns:
+        df['Weather'] = 'Unknown'
+
     return df
 
-def create_severity_violation_chart(df, age_group=None):
-    # Apply age group filter if selected
-    if age_group != 'All Ages':
-        df = df[(df['Age_Group_Drv1'] == age_group) | (df['Age_Group_Drv2'] == age_group)]
-    
-    # Combine violations from both drivers
-    violations_1 = df.groupby(['Violation1_Drv1', 'Injuryseverity']).size().reset_index(name='count')
-    violations_2 = df.groupby(['Violation1_Drv2', 'Injuryseverity']).size().reset_index(name='count')
-    
-    violations_1.columns = ['Violation', 'Severity', 'count']
-    violations_2.columns = ['Violation', 'Severity', 'count']
-    
-    violations = pd.concat([violations_1, violations_2])
-    violations = violations.groupby(['Violation', 'Severity'])['count'].sum().reset_index()
-    
-    # Create visualization
+def create_violation_distribution_chart(df, selected_age='All Ages'):
+    # Filter by age group if needed
+    if selected_age != 'All Ages':
+        df = df[(df['Age_Group_Drv1'] == selected_age) | (df['Age_Group_Drv2'] == selected_age)]
+
+    # Combine violations
+    violations = pd.concat([
+        df['Violation1_Drv1'].value_counts(),
+        df['Violation1_Drv2'].value_counts()
+    ]).groupby(level=0).sum().reset_index()
+    violations.columns = ['Violation', 'Count']
+
     fig = px.bar(
         violations,
         x='Violation',
-        y='count',
-        color='Severity',
-        title=f'Crash Severity Distribution by Violation Type - {age_group}',
-        labels={'count': 'Number of Incidents', 'Violation': 'Violation Type'},
+        y='Count',
+        title=f'Number of Incidents per Violation Type - {selected_age}',
+        labels={'Count': 'Number of Incidents', 'Violation': 'Violation Type'},
         height=600
     )
+    fig.update_layout(clickmode='event+select', xaxis_tickangle=-45)
     
-    fig.update_layout(
-        xaxis_tickangle=-45,
-        legend_title='Severity Level',
-        barmode='stack'
+    return fig, violations
+
+def create_severity_distribution_for_violation(df, violation):
+    # Filter for the selected violation
+    filtered_df = df[(df['Violation1_Drv1'] == violation) | (df['Violation1_Drv2'] == violation)]
+    severity_count = filtered_df['Injuryseverity'].value_counts().reset_index()
+    severity_count.columns = ['Severity', 'Count']
+
+    fig = px.bar(
+        severity_count,
+        x='Severity',
+        y='Count',
+        title=f'Severity Distribution for {violation}',
+        labels={'Count': 'Number of Incidents', 'Severity': 'Injury Severity'},
+        height=400
     )
+    fig.update_layout(xaxis_tickangle=-45)
     
     return fig
 
-def get_top_violations(df, age_group):
-    if age_group == 'All Ages':
-        violations = pd.concat([
-            df['Violation1_Drv1'].value_counts(),
-            df['Violation1_Drv2'].value_counts()
-        ]).groupby(level=0).sum()
-    else:
-        filtered_df = df[
-            (df['Age_Group_Drv1'] == age_group) | 
-            (df['Age_Group_Drv2'] == age_group)
-        ]
-        violations = pd.concat([
-            filtered_df['Violation1_Drv1'].value_counts(),
-            filtered_df['Violation1_Drv2'].value_counts()
-        ]).groupby(level=0).sum()
-    
-    # Convert to DataFrame and format
-    violations_df = violations.reset_index()
-    violations_df.columns = ['Violation Type', 'Count']
-    violations_df['Percentage'] = (violations_df['Count'] / violations_df['Count'].sum() * 100).round(2)
-    violations_df['Percentage'] = violations_df['Percentage'].map('{:.2f}%'.format)
-    
-    return violations_df.head()
-
 @st.cache_data
 def create_map(df, selected_year):
     filtered_df = df[df['Year'] == selected_year]
@@ -130,35 +120,17 @@ def create_map(df, selected_year):
     return m
 
 def create_injuries_fatalities_chart(crash_data, unit_type):
-
-    # 5th visualization title
-    st.header("5. Total Injuries and Fatalities by Month")
-    
-    # Filter rows where we have valid data for all necessary columns
+    # This function remains the same as your original code for that visualization
+    # ...
     crash_data = crash_data[['DateTime', 'Totalinjuries', 'Totalfatalities', 'Unittype_One', 'Unittype_Two']].dropna()
 
-    # Convert "DateTime" to datetime type
     crash_data['DateTime'] = pd.to_datetime(crash_data['DateTime'], errors='coerce')
     crash_data['Month'] = crash_data['DateTime'].dt.month_name()
 
-    # sort months in order
-    month_order = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
+    month_order = ['January', 'February', 'March', 'April', 'May', 'June', 
+                   'July', 'August', 'September', 'October', 'November', 'December']
     crash_data['Month'] = pd.Categorical(crash_data['Month'], categories=month_order, ordered=True)
 
-    # Dropdown for Unit Type selection
-    # Dropdown for Unit Type selection
-    # st.sidebar.selectbox("Select Unit Type", options=['Total'] + crash_data['Unittype_One'].dropna().unique().tolist())  # previous location of dropdown in sidebar
-    # unit_type = st.selectbox("Select Unit Type", options=['Total'] + crash_data['Unittype_One'].dropna().unique().tolist())
-    # unit_type_pairs = set()
-    # for _, row in crash_data[['Unittype_One', 'Unittype_Two']].dropna().iterrows():
-    #     if row['Unittype_One'] != 'Driverless' or row['Unittype_Two'] != 'Driverless':
-    #         pair = ' vs '.join(sorted([row['Unittype_One'], row['Unittype_Two']]))
-    #         unit_type_pairs.add(pair)
-    # # unit_type_pairs = list(unit_type_pairs) # modified as below to sort the dropdown options in alphabetical order
-    # unit_type_pairs = sorted(list(unit_type_pairs))
-    # unit_type = st.selectbox("Select Unit Type Pair", options=['Total'] + unit_type_pairs)
-
-    # Filter data based on the selected unit type
     if unit_type == 'Total':
         filtered_data = crash_data
     else:
@@ -166,10 +138,8 @@ def create_injuries_fatalities_chart(crash_data, unit_type):
         filtered_data = crash_data[((crash_data['Unittype_One'] == unit_one) & (crash_data['Unittype_Two'] == unit_two)) |
                                    ((crash_data['Unittype_One'] == unit_two) & (crash_data['Unittype_Two'] == unit_one))]
 
-    # Group data by month and calculate total injuries and fatalities
     monthly_sum = filtered_data.groupby('Month').agg({'Totalinjuries': 'sum', 'Totalfatalities': 'sum'}).reset_index()
 
-    # Reshape the data for easier plotting
     injuries = monthly_sum[['Month', 'Totalinjuries']].rename(columns={'Totalinjuries': 'Value'})
     injuries['Measure'] = 'Total Injuries'
 
@@ -178,46 +148,6 @@ def create_injuries_fatalities_chart(crash_data, unit_type):
 
     combined_data = pd.concat([injuries, fatalities])
 
-    # Originally tried to use bar chart but switched to line chart for better trend visualization
-    # alt.Chart(monthly_sum).mark_bar().encode(
-    #     x=alt.X('Month', sort=month_order, title='Month'),
-    #     y=alt.Y('Totalinjuries', title='Total Injuries', axis=alt.Axis(titleColor='blue', labelColor='blue', tickColor='blue')),
-    #     color=alt.value('blue'),
-    #     tooltip=['Month', 'Totalinjuries']
-    # ).properties(
-    #     title='Total Injuries and Fatalities by Month',
-    #     width=300,
-    #     height=300
-    # ) + alt.Chart(monthly_sum).mark_bar().encode(
-    #     x=alt.X('Month', sort=month_order, title='Month'),
-    #     y=alt.Y('Totalfatalities', title='Total Fatalities', axis=alt.Axis(titleColor='red', labelColor='red', tickColor='red')),
-    #     color=alt.value('red'),
-    #     tooltip=['Month', 'Totalfatalities']
-    # )
-
-    # Tried to figure out how to plot a legend using altair
-    # line_chart = alt.Chart(monthly_sum).mark_line(point=True).encode(
-    #     x=alt.X('Month', sort=month_order, title='Month'),
-    #     y=alt.Y('Totalinjuries', title='Total Injuries & Fatalities', axis=alt.Axis(titleColor='black')),
-    #     color=alt.value('blue'),
-    #     tooltip=['Month', 'Totalinjuries']
-    # ).properties(
-    #     title=f'Total Injuries and Fatalities by Month for Unit Type Pair: {unit_type}',
-    #     width=600,
-    #     height=400
-    # ) + alt.Chart(monthly_sum).mark_line(point=True).encode(
-    #     x=alt.X('Month', sort=month_order, title='Month'),
-    #     y=alt.Y('Totalfatalities', axis=alt.Axis(titleColor='red')),
-    #     color=alt.value('red'),
-    #     tooltip=['Month', 'Totalfatalities']
-    # ).configure_legend(
-    #     titleFontSize=14,
-    #     labelFontSize=12,
-    #     titleColor='black',
-    #     labelColor='black'
-    # )
-    
-    # Plot line chart
     line_chart = alt.Chart(combined_data).mark_line(point=True).encode(
         x=alt.X('Month:N', sort=month_order, title='Month'),
         y=alt.Y('Value:Q', title='Total Injuries & Fatalities'),
@@ -229,29 +159,15 @@ def create_injuries_fatalities_chart(crash_data, unit_type):
         height=400
     )
 
-    # # Combine the charts (trying to make legend)
-    # combined_chart = alt.layer(line_chart_injuries, line_chart_fatalities).properties(
-    #     title=f'Total Injuries and Fatalities by Month for Unit Type Pair: {unit_type}',
-    #     width=600,
-    #     height=400
-    # ).configure_legend(
-    #     titleFontSize=14,
-    #     labelFontSize=12,
-    #     titleColor='black',
-    #     labelColor='black'
-    # )
-    
     return line_chart
 
 def create_crash_trend_chart(df, weather=None):
     if weather and weather != 'All Conditions':
         df = df[df['Weather'] == weather]
     
-    # Group data by year and count unique Incident IDs
     trend_data = df.groupby('Year')['Incidentid'].nunique().reset_index()
     trend_data.columns = ['Year', 'Crash Count']
     
-    # Create line graph
     fig = px.line(
         trend_data,
         x='Year',
@@ -268,18 +184,13 @@ def create_crash_trend_chart(df, weather=None):
     return fig
 
 def create_category_distribution_chart(df, selected_category, selected_year):
-    # Filter by selected year
     if selected_year != 'All Years':
         df = df[df['Year'] == int(selected_year)]
 
-    # Group by selected category and Injury Severity
     grouped_data = df.groupby([selected_category, 'Injuryseverity']).size().reset_index(name='Count')
-
-    # Calculate percentages for each category value
     total_counts = grouped_data.groupby(selected_category)['Count'].transform('sum')
     grouped_data['Percentage'] = (grouped_data['Count'] / total_counts * 100).round(2)
 
-    # Create the stacked bar chart using Plotly
     fig = px.bar(
         grouped_data,
         x=selected_category,
@@ -291,7 +202,6 @@ def create_category_distribution_chart(df, selected_category, selected_year):
         height=600,
     )
 
-    # Customize the chart appearance
     fig.update_traces(texttemplate='%{text}%', textposition='inside')
     fig.update_layout(
         barmode='stack',
@@ -313,24 +223,15 @@ def main():
     - Nirmal Attarde
     - Maanas Sandeep Agrawa
     """)
-    
 
     st.markdown("""
     ### Introduction to the Traffic Accident Dataset
-    This dataset contains detailed information about traffic accidents in the city of **Tempe**. It includes various attributes of the accidents, such as the severity of injuries, the demographics of the drivers involved, the locations of the incidents, and the conditions at the time of the accidents. The dataset covers accidents that occurred over several years, with data on factors like **weather conditions**, **road surface conditions**, the **time of day**, and the type of **violations** (e.g., alcohol or drug use) that may have contributed to the accident.
-    
-    The data was sourced from **Tempe City's traffic incident reports** and provides a comprehensive view of the factors influencing road safety and accident severity in the city. By analyzing this dataset, we can gain insights into the key contributors to traffic incidents and uncover trends that could help improve traffic safety measures, urban planning, and law enforcement policies in the city.
+    This dataset contains detailed information about traffic accidents in the city of **Tempe**. It includes various attributes of the accidents, such as the severity of injuries, the demographics of the drivers involved, the locations of the incidents, and the conditions at the time of the accidents.
     """)
-    
-    
-    
+
     # Load data
     df = load_and_preprocess_data('1.08_Crash_Data_Report_(detail).csv')
 
-    if 'Weather' not in df.columns:
-        df['Weather'] = 'Unknown'
-    
-    # Create tabs for different visualizations
     tab1, tab2, tab3, tab4, tab5 = st.tabs(["Crash Statistics", "Crash Map", "Crash Trend", "Crash Injuries/Fatalities","Distribution by Category"])
     
     with tab1:
@@ -338,11 +239,20 @@ def main():
         age_groups = ['All Ages', '16-25', '26-35', '36-45', '46-55', '56-65', '65+']
         selected_age = st.selectbox('Select Age Group:', age_groups)
         
-        # Create and display chart
-        fig = create_severity_violation_chart(df, selected_age)
+        # Create and display the main violation distribution chart
+        fig, violations = create_violation_distribution_chart(df, selected_age)
+        
+        # Use plotly_events to capture click
+        selected_points = plotly_events(fig, click_event=True, hover_event=False, select_event=True)
         st.plotly_chart(fig, use_container_width=True)
         
-        # Display statistics
+        # If user clicked on a bar, selected_points will contain data about that click
+        if selected_points:
+            clicked_violation = violations.iloc[selected_points[0]['pointIndex']]['Violation']
+            severity_fig = create_severity_distribution_for_violation(df, clicked_violation)
+            st.plotly_chart(severity_fig, use_container_width=True)
+        
+        # Display total incidents info
         if selected_age == 'All Ages':
             total_incidents = len(df)
         else:
@@ -351,88 +261,32 @@ def main():
                 (df['Age_Group_Drv2'] == selected_age)
             ])
         
-        # Create two columns for statistics
-        col1, col2 = st.columns(2)
-        
-        with col1:
-            st.markdown(f"### Total Incidents")
-            st.markdown(f"**{total_incidents:,}** incidents for {selected_age}")
-        
-        with col2:
-            st.markdown("### Top Violations")
-            top_violations = get_top_violations(df, selected_age)
-            st.table(top_violations)
-    
+        st.markdown(f"### Total Incidents for {selected_age}")
+        st.markdown(f"**{total_incidents:,}** incidents")
+
     with tab2:
-        # Year selection for map
         years = sorted(df['Year'].unique())
         selected_year = st.selectbox('Select Year:', years)
         
-        # Create and display map
         st.markdown("### Crash Location Map")
-        map_placeholder = st.empty()
-        with map_placeholder:
-            m = create_map(df, selected_year)
-            map_data = st_folium(
-                m,
-                width=800,
-                height=600,
-                key=f"map_{selected_year}",
-                returned_objects=["null_drawing"]
-            )
-
-        st.markdown("""
-            ### Traffic Crash Location Map
-            This interactive map visualizes traffic accidents in Tempe for the selected year. It combines **marker clustering** and a **heatmap** to show:
-            1. **Accident Markers**: Red markers indicate individual accidents, with popups displaying the coordinates, date/time, and severity of each incident.
-            2. **Heatmap**: The heatmap highlights accident hotspots with colors ranging from blue (low frequency) to yellow (moderate) and red (high frequency), showing areas with more frequent accidents.
-            
-            **Key Features:**
-            * **Interactive Year Selection**: Users can select a year to view accidents for that specific time.
-            * **Accident Patterns**: The map reveals accident-prone areas and severity patterns, helping identify dangerous locations.
-            
-            **Color Scheme:**
-            * **Red**: Individual accident markers.
-            * **Blue to Red**: Heatmap colors indicate accident frequency, from low (blue) to high (red).
-            
-            This map provides insights into accident trends and can help guide safety improvements in the city.
-            """)
+        m = create_map(df, selected_year)
+        st_folium(
+            m,
+            width=800,
+            height=600,
+            key=f"map_{selected_year}",
+            returned_objects=["null_drawing"]
+        )
 
-        
-    
     with tab3:
-        # Weather condition filter
         weather = ['All Conditions'] + sorted(df['Weather'].unique())
         selected_weather = st.selectbox('Select Weather Condition:', weather)
         
-        # Create and display line graph
         st.markdown("### Crash Trend Over Time")
         trend_fig = create_crash_trend_chart(df, selected_weather)
         st.plotly_chart(trend_fig, use_container_width=True)
 
-        st.markdown("""
-        ## **Crash Trend Over Time**
-        This interactive line chart visualizes the trend of unique traffic crashes over the years, optionally filtered by weather conditions. It highlights how crash frequency changes over time, helping identify trends and potential contributing factors.
-
-        **Key Features:**
-        * **Time Trend Analysis**: Displays the total number of unique crashes for each year, showing long-term patterns.
-        * **Weather Filter**: Users can filter the data by weather conditions (e.g., "Rainy", "Sunny") to analyze how weather impacts crash trends.
-        * **Interactive Tooltips**: Hovering over data points reveals the exact crash count for each year, providing detailed insights.
-
-        **Color Scheme and Design:**
-        * **Line and Markers**: A smooth line connects data points, with prominent markers for each year to highlight trends clearly.
-        * **Dynamic Title**: The chart updates its title to reflect the selected weather condition or "All Conditions" for the overall trend.
-
-        **Insights:**
-        This chart helps uncover:
-           * Annual fluctuations in crash incidents.
-           * Correlations between weather conditions and crash frequencies.
-           * Historical patterns that can guide future safety measures and urban planning decisions
-        """)
-        
-
     with tab4:
-        # Dropdown for Unit Type selection
         unit_type_pairs = set()
         for _, row in df[['Unittype_One', 'Unittype_Two']].dropna().iterrows():
             if row['Unittype_One'] != 'Driverless' or row['Unittype_Two'] != 'Driverless':
@@ -441,21 +295,10 @@ def main():
         unit_type_pairs = sorted(list(unit_type_pairs))
         unit_type = st.selectbox("Select Unit Type Pair", options=['Total'] + unit_type_pairs)
     
-        # Create 5th Visualization: Injuries and fatalities chart
         injuries_fatalities_chart = create_injuries_fatalities_chart(df, unit_type)
         st.altair_chart(injuries_fatalities_chart, use_container_width=True)
-        st.markdown("""        
-        This line chart shows the **total number of injuries and fatalities by month for the selected unit type pair**. The blue line represents total injuries, while the red line represents total fatalities. Observing the trends over the months can help identify any seasonal patterns or peaks in traffic incidents involving specific unit types.
-        
-        - **Total Injuries**: The blue line indicates how injuries vary over different months, highlighting any particular spikes or declines.
-        - **Total Fatalities**: The red line shows the trend for fatalities, which is generally much lower compared to injuries.
-        - **Unit Types**: The dropdown selection allows users to filter the data by specific unit type pairs (e.g., Driver vs Pedestrian) or view the overall trend across all types.
-        
-        This visualization aims to provide an intuitive understanding of how injuries and fatalities are distributed across the year, helping stakeholders develop targeted safety measures.
-        """)
-        
+
     with tab5:
-        # Dropdown for category selection
         categories = [
             'Collisionmanner',
             'Lightcondition',
@@ -465,28 +308,12 @@ def main():
             'Gender_Drv1',
         ]
         selected_category = st.selectbox("Select Category:", categories)
-
-        # Dropdown for year selection
         years = ['All Years'] + sorted(df['Year'].dropna().unique().astype(int).tolist())
         selected_year = st.selectbox("Select Year:", years)
-
-        # Generate and display the distribution chart
+        
         st.markdown(f"### Distribution of Incidents by {selected_category}")
         distribution_chart = create_category_distribution_chart(df, selected_category, selected_year)
         st.plotly_chart(distribution_chart, use_container_width=True)
 
-        st.markdown("""
-        ## Distribution by Category
-        This visualization explores the distribution of traffic incidents across various categories, such as Collision Manner, Weather, Surface Condition, Alcohol Use, and Driver Gender. Each bar represents a specific category value (e.g., "Male" or "Female" for Gender), and the bars are divided into segments based on Injury Severity (e.g., Minor, Moderate, Serious, Fatal).
-
-        **Key features include:**
-        * Interactive Filters: Select a category and filter by year to analyze trends over time.
-        * Insightful Tooltips: Hover over each segment to view the exact count and percentage of incidents for a given severity level.
-        * Comparative Analysis: Quickly identify how different conditions or behaviors correlate with injury severity.
-
-        This chart provides actionable insights into factors contributing to traffic incidents and their outcomes, helping stakeholders target interventions and improve road safety.
-        """)
-
-
 if __name__ == "__main__":
-    main()
+    main()