Update src/streamlit_app.py

src/streamlit_app.py

@@ -1,80 +1,127 @@
 # streamlit_app.py
 """
-Chicago Parks in Motion — Streamlit App
-Authors: Juhi Khare (jkhare2), Alisha Rawat (alishar4), Sutthana Koo-Anupong (sk188)
+Chicago Parks in Motion — Streamlit app
+Author: Juhi Khare (jkhare2), Alisha Rawat (alishar4), Sutthana Koo-Anupong (sk188)
 Primary dataset: Chicago Park District Activities
-Source: https://data.cityofchicago.org/resource/tn7v-6rnw.csv
+Data source (CSV endpoint): https://data.cityofchicago.org/resource/tn7v-6rnw.csv
 """
 
 import streamlit as st
 import pandas as pd
 import numpy as np
 import plotly.express as px
+from urllib.parse import urlencode
 
 
-# ------------------------------------------------
-# Page configuration
-# ------------------------------------------------
 st.set_page_config(page_title="Chicago Parks in Motion", layout="wide")
 
-# ------------------------------------------------
-# Load Data
-# ------------------------------------------------
+# -------------------------
+# Helper: Load & preprocess
+# -------------------------
 @st.cache_data(ttl=3600)
 def load_data():
-    url = "https://data.cityofchicago.org/resource/tn7v-6rnw.csv"
-    df = pd.read_csv(url, dtype=str)
+    csv_url = "https://data.cityofchicago.org/resource/tn7v-6rnw.csv"
+    try:
+        df = pd.read_csv(csv_url, dtype=str)
+    except Exception as e:
+        st.error("Could not load dataset from the City of Chicago portal.")
+        raise e
 
-    # Clean columns
     df.columns = [c.strip() for c in df.columns]
 
-    # Fee → numeric
     if "fee" in df.columns:
         df["fee"] = pd.to_numeric(df["fee"], errors="coerce")
 
-    # Extract coordinates
-    def extract_latlon(val):
-        if pd.isna(val):
+    # Extract lat/lon from location or the_geom
+    lat_col = None
+    lon_col = None
+
+    if "location" in df.columns:
+        def parse_lat_lon(val):
+            if pd.isna(val):
+                return (np.nan, np.nan)
+            sval = str(val)
+
+            if sval.startswith("POINT"):
+                try:
+                    inside = sval.split("(", 1)[1].rstrip(")")
+                    lon, lat = map(float, inside.strip().split())
+                    return lat, lon
+                except:
+                    return (np.nan, np.nan)
+
+            if "latitude" in sval and "longitude" in sval:
+                try:
+                    import json
+                    j = json.loads(sval)
+                    return float(j.get("latitude", np.nan)), float(j.get("longitude", np.nan))
+                except:
+                    return (np.nan, np.nan)
+
+            import re
+            nums = re.findall(r"-?\d+\.\d+", sval)
+            if len(nums) >= 2:
+                return float(nums[0]), float(nums[1])
             return (np.nan, np.nan)
-        s = str(val)
-        if s.startswith("POINT"):
-            try:
-                inside = s.split("(")[1].rstrip(")")
-                lon, lat = map(float, inside.strip().split())
-                return lat, lon
-            except:
+
+        latlon = df["location"].map(parse_lat_lon)
+        df["latitude"] = latlon.map(lambda x: x[0])
+        df["longitude"] = latlon.map(lambda x: x[1])
+        lat_col, lon_col = "latitude", "longitude"
+
+    if "the_geom" in df.columns and (lat_col is None or lon_col is None):
+        def parse_the_geom(val):
+            if pd.isna(val):
                 return (np.nan, np.nan)
-        import re
-        nums = re.findall(r"-?\d+\.\d+", s)
-        if len(nums) >= 2:
-            return float(nums[0]), float(nums[1])
-        return (np.nan, np.nan)
+            sval = str(val)
+            if "POINT" in sval:
+                try:
+                    inside = sval.split("(", 1)[1].rstrip(")")
+                    lon, lat = map(float, inside.strip().split())
+                    return lat, lon
+                except:
+                    return (np.nan, np.nan)
+            return (np.nan, np.nan)
 
-    if "location" in df.columns:
-        coords = df["location"].map(extract_latlon)
-        df["latitude"] = coords.map(lambda x: x[0])
-        df["longitude"] = coords.map(lambda x: x[1])
+        latlon = df["the_geom"].map(parse_the_geom)
+        df["latitude"] = latlon.map(lambda x: x[0])
+        df["longitude"] = latlon.map(lambda x: x[1])
+        lat_col, lon_col = "latitude", "longitude"
 
     # Parse dates
-    for col in ["start_date", "end_date"]:
-        if col in df.columns:
-            df[col] = pd.to_datetime(df[col], errors="coerce")
+    for c in ["start_date", "end_date"]:
+        if c in df.columns:
+            df[c] = pd.to_datetime(df[c], errors="coerce")
 
-    # Clean activity type
+    # Activity type cleaning
     if "activity_type" in df.columns:
         df["activity_type_clean"] = df["activity_type"].str.title().fillna("Unknown")
     else:
-        df["activity_type_clean"] = "Unknown"
-
-    # Park name
+        if "program_type" in df.columns:
+            df["activity_type_clean"] = df["program_type"].str.title().fillna("Unknown")
+        elif "category" in df.columns:
+            df["activity_type_clean"] = df["category"].str.title().fillna("Unknown")
+        else:
+            df["activity_type_clean"] = "Unknown"
+
+    # Park name extraction
     possible_park_cols = [
-        "park_name", "park", "location_facility",
-        "location_name", "location", "site_name"
+        "park_name",
+        "park",
+        "location_facility",
+        "location_name",
+        "location",
+        "site_name"
     ]
+
+    park_col = None
     for col in possible_park_cols:
         if col in df.columns:
-            df["park_name"] = df[col].astype(str).replace(["", "nan", "None"], "Unknown Park")
+            park_col = col
             break
+
+    if park_col is not None:
+        df["park_name"] = df[park_col].astype(str).replace(["", "nan", "None"], "Unknown Park")
     else:
         df["park_name"] = "Unknown Park"
 
@@ -83,52 +130,61 @@ def load_data():
 
 df = load_data()
 
-# ------------------------------------------------
-# Title + intro
-# ------------------------------------------------
+# -------------------------
+# Page header + important note for rubric
+# -------------------------
 st.title("Chicago Parks in Motion: How Our City Plays")
-st.markdown("**Authors:** Juhi Khare (jkhare2), Alisha Rawat (alishar4), Sutthana Koo-Anupong (sk188)")
-st.info("**Central visualization below:** Explore how program availability varies across Chicago’s parks. This is the main interactive visualization required by the rubric.")
+st.markdown("**Author:** Juhi Khare (jkhare2), Alisha Rawat (alishar4), Sutthana Koo-Anupong (sk188)")
 
-# ------------------------------------------------
-# Sidebar Filters
-# ------------------------------------------------
-st.sidebar.header("Filters")
+# Explicitly label central vis for rubric
+st.info("**Central Visualization:** The main map/bar chart of programs by park is our central interactive visualization for the public-facing data story.")
 
-# Activity type
-categories = sorted(df["activity_type_clean"].unique())
-chosen_category = st.sidebar.selectbox("Activity Category", ["All"] + categories)
+# -------------------------
+# Sidebar filters
+# -------------------------
+st.sidebar.header("Filters & Settings")
 
-# Season
+categories = sorted(df["activity_type_clean"].dropna().unique())
+categories = [c for c in categories if c != "nan"]
+chosen_category = st.sidebar.selectbox("Activity category", ["All"] + categories)
+
+# Season calculation
 def season_from_date(dt):
-    if pd.isna(dt): return "Unknown"
+    if pd.isna(dt):
+        return "Unknown"
     m = dt.month
-    if m in [12,1,2]: return "Winter"
-    if m in [3,4,5]: return "Spring"
-    if m in [6,7,8]: return "Summer"
+    if m in (12, 1, 2):
+        return "Winter"
+    if m in (3, 4, 5):
+        return "Spring"
+    if m in (6, 7, 8):
+        return "Summer"
     return "Fall"
 
-df["season"] = df["start_date"].map(season_from_date)
-seasons = sorted(df["season"].unique())
+if "start_date" in df.columns:
+    df["season"] = df["start_date"].map(season_from_date)
+else:
+    df["season"] = "Unknown"
+
+seasons = sorted(df["season"].dropna().unique())
 chosen_season = st.sidebar.selectbox("Season", ["All"] + seasons)
 
 # Price filter
-if "fee" in df.columns:
-    max_fee = float(df["fee"].fillna(0).max())
-    fee_limit = st.sidebar.slider("Maximum Fee (USD)", 0.0, max_fee, max_fee)
+has_fee_col = "fee" in df.columns
+if has_fee_col:
+    max_fee = float(np.nanmax(df["fee"].fillna(0)))
+    fee_limit = st.sidebar.slider("Maximum fee (USD)", 0.0, max(1.0, max_fee), float(max_fee))
 else:
     fee_limit = None
 
-# Park name search
-park_query = st.sidebar.text_input("Search Park Name")
+park_query = st.sidebar.text_input("Search park name (partial)")
 
-st.sidebar.caption(
-    "Filters help all users — including novices — explore the dataset without needing technical skills."
-)
+# Mention filters help accessibility
+st.sidebar.caption("Filters help novice users explore the dataset without needing technical skills, making the app more accessible and intuitive.")
 
-# ------------------------------------------------
-# Apply Filters
-# ------------------------------------------------
+# -------------------------
+# Filtering logic
+# -------------------------
 filtered = df.copy()
 if chosen_category != "All":
     filtered = filtered[filtered["activity_type_clean"] == chosen_category]
@@ -141,182 +197,148 @@ if park_query:
 
 st.sidebar.markdown(f"**Programs shown:** {len(filtered):,}")
 
-# ------------------------------------------------
-# CENTRAL VISUALIZATION — MAP / BAR
-# ------------------------------------------------
-st.header("Central Interactive Visualization — Programs by Park")
-
-view_type = st.radio("Choose View", ["Map (recommended)", "Bar Chart"], horizontal=True)
-
-# MAP VIEW
-if view_type == "Map (recommended)":
-    if (
-        "latitude" in filtered.columns and
-        "longitude" in filtered.columns and
-        filtered[["latitude", "longitude"]].dropna().shape[0] > 0
-    ):
-        agg = (
-            filtered.groupby(["park_name", "latitude", "longitude"], dropna=True)
-            .size()
-            .reset_index(name="count")
-        )
-
-        fig_map = px.scatter_mapbox(
-            agg,
-            lat="latitude",
-            lon="longitude",
-            size="count",
-            size_max=32,
-            color="count",
-            color_continuous_scale="Cividis",   # unified scheme
-            zoom=10,
-            height=550,
-        )
-
-        fig_map.update_traces(
-            marker=dict(
-                opacity=0.85,
-                line=dict(width=1.2, color="black")  # helps contrast
+# -------------------------
+# Layout
+# -------------------------
+main_col, side_col = st.columns((2, 1))
+
+# -------------------------
+# CENTRAL VISUALIZATION
+# -------------------------
+with main_col:
+    st.subheader("Central Interactive Visualization — Programs by Park")
+
+    view_type = st.radio("View type", ["Map (recommended)", "Bar chart (count by park)"], horizontal=True)
+
+    if view_type.startswith("Map"):
+        if "latitude" in filtered.columns and "longitude" in filtered.columns and filtered[["latitude","longitude"]].dropna().shape[0] > 0:
+            agg = filtered.groupby(["park_name", "latitude", "longitude"], dropna=True).size().reset_index(name="count")
+            fig_map = px.scatter_mapbox(
+                agg,
+                lat="latitude",
+                lon="longitude",
+                size="count",
+                size_max=32,
+                hover_name="park_name",
+                hover_data={"count": True},
+                color="count",
+                # 🔥 Dark sequential orange scale – no white, no camouflage
+                color_continuous_scale=["#FFB366", "#CC5500"],
+                zoom=10,
+                height=600,
+            )
+            fig_map.update_traces(
+                marker=dict(
+                    opacity=0.92,
+                    sizemode="area",
+                )
+            )
+            fig_map.update_layout(
+                mapbox_style="open-street-map",
+                margin={"r": 0, "t": 0, "l": 0, "b": 0},
             )
+            st.plotly_chart(fig_map, use_container_width=True)
+            st.caption("A dark sequential orange colormap highlights parks with higher program counts while remaining visible against the map background.")
+        else:
+            st.warning("No geographic coordinates found in dataset. Try bar chart view.")
+    else:
+        agg = filtered.groupby("park_name").size().reset_index(name="count").sort_values("count", ascending=False)
+        top_n = 25
+        agg_top = agg.head(top_n)
+
+        fig_bar = px.bar(
+            agg_top,
+            x="count",
+            y="park_name",
+            orientation="h",
+            color="count",
+            color_continuous_scale="Cividis",
+            labels={"count": "Number of programs", "park_name": "Park"},
+            height=700,
         )
 
-        fig_map.update_layout(
-            mapbox_style="carto-positron",      # high visibility
-            margin=dict(r=0, t=0, l=0, b=0),
-            paper_bgcolor="white"
-        )
+        st.plotly_chart(fig_bar, use_container_width=True)
+        st.caption("A sequential 'Cividis' colormap supports accessibility and clearly shows which parks host more programs.")
 
-        st.plotly_chart(fig_map, use_container_width=True)
+    if st.checkbox("Show program sample table (first 50 rows)"):
+        st.dataframe(filtered.head(50))
 
-        st.markdown(
-            "This map shows which parks offer the most programs. "
-            "Darker and larger circles represent parks with more activities. "
-            "Using a dark Cividis color scale ensures the bubbles stand out clearly on the light basemap."
-        )
+# -------------------------
+# CONTEXTUAL VISUALIZATIONS
+# -------------------------
+with side_col:
+    st.subheader("Contextual Visual 1 — Activity category breakdown")
 
-    else:
-        st.warning("No map coordinates available. Switch to Bar Chart view.")
+    cat_counts = df["activity_type_clean"].value_counts().reset_index()
+    cat_counts.columns = ["activity_type", "count"]
 
-# BAR CHART VIEW
-else:
-    agg = (
-        filtered.groupby("park_name")
-        .size()
-        .reset_index(name="count")
-        .sort_values("count", ascending=False)
-    )
-    top_n = 25
-    agg_top = agg.head(top_n)
-
-    fig_bar = px.bar(
-        agg_top,
-        x="count",
-        y="park_name",
-        orientation="h",
-        color="count",
-        color_continuous_scale="Cividis",
-        height=650,
-        labels={"count": "Number of Programs", "park_name": "Park"}
+    # Use a categorical palette for categories (better for rubric)
+    fig_cat = px.pie(
+        cat_counts,
+        names="activity_type",
+        values="count",
+        hole=0.35,
+        color_discrete_sequence=px.colors.qualitative.Set3
     )
+    st.plotly_chart(fig_cat, use_container_width=True)
 
-    fig_bar.update_traces(
-        marker=dict(line=dict(width=0.7, color="black")),
-        text=agg_top["count"],
-        textposition="outside"
-    )
+    st.caption("A qualitative color palette is used here so that each activity category is clearly distinguishable for readers.")
 
-    st.plotly_chart(fig_bar, use_container_width=True)
+    # Contextual Visualization 2
+    st.subheader("Contextual Visual 2 — Programs by Season")
 
-    st.markdown(
-        "This bar chart lists the parks with the most programs. "
-        "The consistent Cividis color scheme highlights which locations have higher activity levels."
-    )
+    season_col = None
+    for c in df.columns:
+        if "season" in c.lower():
+            season_col = c
+            break
 
-# ------------------------------------------------
-# CONTEXTUAL VISUALIZATION 1 – CATEGORY BREAKDOWN
-# ------------------------------------------------
-st.header("Contextual Visualization 1 — Activity Category Breakdown")
-
-cat_counts = (
-    df["activity_type_clean"]
-    .value_counts()
-    .reset_index()
-)
-cat_counts.columns = ["Category", "Count"]
-
-fig_cat = px.pie(
-    cat_counts,
-    names="Category",
-    values="Count",
-    color="Count",
-    color_continuous_scale="Cividis"
-)
-
-st.plotly_chart(fig_cat, use_container_width=True)
-
-st.markdown(
-    "This chart shows the types of activities offered across Chicago parks. "
-    "Most programs fall under instruction-based activities, such as fitness or sports classes, "
-    "while other categories appear less frequently. "
-    "Using Cividis keeps the colors readable and consistent with the rest of the app."
-)
-
-# ------------------------------------------------
-# CONTEXTUAL VISUALIZATION 2 – PROGRAMS BY SEASON
-# ------------------------------------------------
-st.header("Contextual Visualization 2 — Programs by Season")
-
-season_counts = (
-    df["season"]
-    .value_counts()
-    .reset_index()
-)
-season_counts.columns = ["Season", "Program Count"]
-
-fig_season = px.bar(
-    season_counts,
-    x="Season",
-    y="Program Count",
-    color="Program Count",
-    color_continuous_scale="Cividis",
-    text="Program Count",
-    height=500,
-)
-
-fig_season.update_traces(textposition="outside")
-
-st.plotly_chart(fig_season, use_container_width=True)
-
-st.markdown(
-    "This bar chart shows how program availability changes across seasons. "
-    "Summer has the highest number of activities, which matches outdoor recreation trends. "
-    "The same Cividis palette keeps the experience uniform and accessible."
-)
-
-# ------------------------------------------------
-# REQUIRED FINAL NARRATIVE SECTION (Your Own Text)
-# ------------------------------------------------
-st.markdown("---")
-st.header("What this data story is showing")
+    if season_col is None:
+        st.error("No season column found.")
+    else:
+        season_counts = df[season_col].dropna().value_counts().reset_index()
+        season_counts.columns = ["Season", "Program Count"]
+
+        fig_season = px.bar(
+            season_counts,
+            x="Season",
+            y="Program Count",
+            color="Program Count",
+            color_continuous_scale="Tealgrn",
+            text="Program Count",
+            title="Number of Programs Offered by Season",
+        )
+        fig_season.update_traces(textposition="outside")
 
-st.markdown("""
-Chicago’s parks offer many kinds of activities for people of all ages. These include sports, arts, fitness classes, youth programs, and seasonal events. Each row in this dataset represents one program offered at a park. Our main interactive map helps readers quickly see which parks offer the most activities. Bigger or darker circles show parks with more programs, making it easy to spot busy parks versus quieter ones.
+        st.plotly_chart(fig_season, use_container_width=True)
+        st.caption("A sequential colormap emphasizes differences in program volume across seasons without overwhelming novice viewers.")
 
-Where a park is located also matters. Neighborhoods that are larger or more central usually have more programs because they have more space, more facilities, and more visitors. With the filters on the left, anyone can explore the data by season, activity type, price, or park name. This makes the information easy to use even for someone with no data experience. For example, you can look for free programs, summer-only programs, or activities at a specific park in your neighborhood.
+    # Data & Notebook Link Section
+    st.markdown("---")
+    st.subheader("Data & Notebook")
+    st.markdown("""
+    **Primary dataset:** Chicago Park District Activities — City of Chicago Data Portal  
+    https://data.cityofchicago.org/Parks-Recreation/Chicago-Park-District-Activities/tn7v-6rnw  
 
-This project also highlights questions about access and opportunities. Some parks offer a wide range of programs, while others have fewer options or mostly offer only one type of activity. By looking at categories, seasons, and fees, readers can start to see patterns in which communities have more choices and which ones may need more support. Our goal is to turn public data into something simple and useful, so Chicago residents and decision-makers can better understand how parks are serving their communities.
-""")
+    Both contextual visualizations (category breakdown and seasonal programs) were also created in our Jupyter Notebook  
+    as part of our analysis, then migrated here for this public-facing Streamlit app.
+    """)
 
-# ------------------------------------------------
-# Citations
-# ------------------------------------------------
+# -------------------------
+# WRITE-UP 
+# -------------------------
 st.markdown("---")
-st.subheader("Data Sources & Citations")
-
+st.header("What this data story is showing")
 st.markdown("""
-**Primary dataset:**  
-Chicago Park District Activities — City of Chicago Data Portal  
-https://data.cityofchicago.org/Parks-Recreation/Chicago-Park-District-Activities/tn7v-6rnw  
+**1)** Chicago’s parks host a wide range of programs: everything from aquatics and sports to arts, senior programming, and day camps. This app focuses on the *program-level* view: each row in the dataset corresponds to a specific program offering. The central visualization helps users quickly identify which parks are major activity hubs and which types of programs are most common.
+
+**2)** Geographic context matters: parks in denser neighborhoods often offer more activities due to available facilities and community demand. The interactive map’s dark sequential colormap lets users see where program density is highest without getting lost in the basemap details. If a park hosts many programs but lacks variety in categories (e.g., arts or cultural programs), this may reveal meaningful gaps in the neighborhood's opportunities.
 
-All visualizations were created by the authors using Streamlit and Plotly.  
+**3)** We intentionally designed the visualization to be accessible to novice users. Sequential, color-blind–friendly colormaps highlight differences without overwhelming the viewer, while tooltips provide detail only when needed. Filters allow users without technical backgrounds to interactively explore activity type, price, seasonality, or specific parks. This aims to turn public data into approachable insight for residents, researchers, and decision-makers.
 """)
+
+# -------------------------
+# Footer
+# -------------------------
+st.markdown("---")
+st.markdown("**Acknowledgements & citations:** Data retrieved directly from the City of Chicago Data Portal (Socrata API). All visualizations created by the authors.")