Update air_quality_map.py

air_quality_map.py

@@ -6,7 +6,6 @@ from folium.plugins import MarkerCluster
 import tempfile
 import os
 import json
-from branca.element import Figure, JavascriptLink, MacroElement
 
 # Get API credentials from environment variables
 EPA_AQS_API_BASE_URL = "https://aqs.epa.gov/data/api"
@@ -48,9 +47,6 @@ class AirQualityApp:
             "WI": "55", "WY": "56", "DC": "11"
         }
         
-        # Reverse mapping from numeric to two-letter state codes
-        self.numeric_to_state_code = {v: k for k, v in self.state_code_mapping.items()}
-        
         # AQI categories with their corresponding colors - using only valid Folium icon colors
         self.aqi_categories = {
             "Good": "green",
@@ -71,6 +67,28 @@ class AirQualityApp:
             "Hazardous": "#7e0023"  # Maroon
         }
         
+        # Sample county data for demo
+        self.mock_counties = {
+            "CA": [
+                {"code": "037", "value": "Los Angeles"},
+                {"code": "067", "value": "Sacramento"},
+                {"code": "073", "value": "San Diego"},
+                {"code": "075", "value": "San Francisco"}
+            ],
+            "NY": [
+                {"code": "061", "value": "New York"},
+                {"code": "047", "value": "Kings (Brooklyn)"},
+                {"code": "081", "value": "Queens"},
+                {"code": "005", "value": "Bronx"}
+            ],
+            "TX": [
+                {"code": "201", "value": "Harris (Houston)"},
+                {"code": "113", "value": "Dallas"},
+                {"code": "029", "value": "Bexar (San Antonio)"},
+                {"code": "453", "value": "Travis (Austin)"}
+            ]
+        }
+        
         # Sample parameters for demo
         self.mock_parameters = [
             {"code": "88101", "value_represented": "PM2.5 - Local Conditions"},
@@ -80,122 +98,104 @@ class AirQualityApp:
             {"code": "42602", "value_represented": "Nitrogen dioxide"},
             {"code": "81102", "value_represented": "PM10 - Local Conditions"}
         ]
+    
+    def get_monitors(self, state_code, county_code=None, parameter_code=None):
+        """Fetch monitoring stations for a given state and optional county"""
+        # If we don't have API credentials, use mock data
+        if not EMAIL or not API_KEY:
+            return self.mock_get_monitors(state_code, county_code, parameter_code)
         
-        # All monitors data cache 
-        self.all_monitors_cache = {}
+        # Convert state code to numeric format for API
+        api_state_code = state_code
+        if len(state_code) == 2 and state_code in self.state_code_mapping:
+            api_state_code = self.state_code_mapping[state_code]
+            
+        # API endpoint for monitoring sites
+        endpoint = f"{EPA_AQS_API_BASE_URL}/monitors/byState"
         
-    def get_monitors_by_coordinates(self, min_lat, max_lat, min_lon, max_lon, parameter_code=None):
-        """Fetch monitoring stations based on coordinate bounds"""
+        params = {
+            "email": EMAIL,
+            "key": API_KEY,
+            "state": api_state_code,
+            "bdate": "20240101",  # Beginning date (YYYYMMDD)
+            "edate": "20240414",  # End date (YYYYMMDD)
+        }
         
-        # For demo/development without API credentials, use mock data
-        if not EMAIL or not API_KEY:
-            return self.mock_get_monitors_by_coordinates(min_lat, max_lat, min_lon, max_lon, parameter_code)
-        
-        # Determine which states are in the bounding box
-        # This requires a more complex spatial algorithm in real implementation
-        # For simplicity, we'll use a predefined mapping based on state centers
-        states_in_bounds = self.get_states_in_bounds(min_lat, max_lat, min_lon, max_lon)
-        
-        all_monitors = []
-        for state_code in states_in_bounds:
-            # Convert state code to numeric format for API
-            api_state_code = state_code
-            if len(state_code) == 2 and state_code in self.state_code_mapping:
-                api_state_code = self.state_code_mapping[state_code]
-                
-            # Check if we have cached data for this state
-            cache_key = f"{api_state_code}_{parameter_code or 'all'}"
-            if cache_key in self.all_monitors_cache:
-                monitors = self.all_monitors_cache[cache_key]
-            else:
-                # API endpoint for monitoring sites
-                endpoint = f"{EPA_AQS_API_BASE_URL}/monitors/byState"
-                
-                params = {
-                    "email": EMAIL,
-                    "key": API_KEY,
-                    "state": api_state_code,
-                    "bdate": "20240101",  # Beginning date (YYYYMMDD)
-                    "edate": "20240414",  # End date (YYYYMMDD)
-                }
-                
-                if parameter_code:
-                    params["param"] = parameter_code
-                
-                try:
-                    response = requests.get(endpoint, params=params)
-                    data = response.json()
-                    
-                    # Handle the specific response structure
-                    if isinstance(data, dict) and "Data" in data and isinstance(data["Data"], list):
-                        monitors = data["Data"]
-                    elif isinstance(data, dict) and "Header" in data and isinstance(data["Header"], list):
-                        if len(data["Header"]) > 0 and data["Header"][0].get("status") == "Success":
-                            monitors = data.get("Data", [])
-                        else:
-                            print(f"Header does not contain success status: {data['Header']}")
-                            monitors = []
-                    else:
-                        print(f"Unexpected response format for monitors")
-                        monitors = []
-                        
-                    # Cache this data for future use
-                    self.all_monitors_cache[cache_key] = monitors
-                except Exception as e:
-                    print(f"Error fetching monitors for {state_code}: {e}")
-                    monitors = []
+        if county_code:
+            params["county"] = county_code
             
-            # Filter monitors based on the coordinate bounds
-            bounds_filtered_monitors = []
-            for monitor in monitors:
-                lat = float(monitor.get("latitude", 0))
-                lon = float(monitor.get("longitude", 0))
-                if min_lat <= lat <= max_lat and min_lon <= lon <= max_lon:
-                    bounds_filtered_monitors.append(monitor)
+        if parameter_code:
+            params["param"] = parameter_code
+        
+        try:
+            response = requests.get(endpoint, params=params)
+            data = response.json()
             
-            all_monitors.extend(bounds_filtered_monitors)
+            # Add detailed debugging
+            print(f"API Response Keys: {list(data.keys()) if isinstance(data, dict) else 'Not a dictionary'}")
+            if isinstance(data, dict) and "Header" in data:
+                print(f"Header type: {type(data['Header'])}, content: {data['Header'][:100]}...")
+            
+            # Handle the specific response structure we observed
+            if isinstance(data, dict):
+                if "Data" in data and isinstance(data["Data"], list):
+                    return data["Data"]
+                elif "Header" in data and isinstance(data["Header"], list):
+                    if len(data["Header"]) > 0 and data["Header"][0].get("status") == "Success":
+                        return data.get("Data", [])
+                    else:
+                        print(f"Header does not contain success status: {data['Header']}")
+                # Special case - return mock data if we can't parse the API response
+                print(f"Using mock data instead of API response for state {state_code}")
+                return self.mock_get_monitors(state_code, county_code, parameter_code)
+            else:
+                print(f"Unexpected response format for monitors: {type(data)}")
+                return self.mock_get_monitors(state_code, county_code, parameter_code)
+        except Exception as e:
+            print(f"Error fetching monitors: {e}")
+            return self.mock_get_monitors(state_code, county_code, parameter_code)
+
+    def get_counties(self, state_code):
+        """Fetch counties for a given state"""
+        # If we don't have API credentials, use mock data
+        if not EMAIL or not API_KEY:
+            return self.mock_get_counties(state_code)
         
-        return all_monitors
-    
-    def get_states_in_bounds(self, min_lat, max_lat, min_lon, max_lon):
-        """
-        Determine which states have area within the coordinate bounds.
-        This is a simplified approach and would need a more sophisticated spatial algorithm
-        for accurate results in a production environment.
-        """
-        # Approximate state centers (simplified for demo purposes)
-        state_centers = {
-            "AL": (32.8067, -86.7911), "AK": (64.2008, -149.4937), "AZ": (34.0489, -111.0937),
-            "AR": (34.9513, -92.3809), "CA": (36.7783, -119.4179), "CO": (39.5501, -105.7821),
-            "CT": (41.6032, -73.0877), "DE": (38.9108, -75.5277), "FL": (27.9944, -81.7603),
-            "GA": (32.1656, -82.9001), "HI": (19.8968, -155.5828), "ID": (44.0682, -114.7420),
-            "IL": (40.6331, -89.3985), "IN": (40.2672, -86.1349), "IA": (41.8780, -93.0977),
-            "KS": (39.0119, -98.4842), "KY": (37.8393, -84.2700), "LA": (30.9843, -91.9623),
-            "ME": (45.2538, -69.4455), "MD": (39.0458, -76.6413), "MA": (42.4072, -71.3824),
-            "MI": (44.3148, -85.6024), "MN": (46.7296, -94.6859), "MS": (32.7546, -89.6783),
-            "MO": (38.5767, -92.1735), "MT": (46.8797, -110.3626), "NE": (41.4925, -99.9018),
-            "NV": (38.8026, -116.4194), "NH": (43.1939, -71.5724), "NJ": (40.0583, -74.4057),
-            "NM": (34.5199, -105.8701), "NY": (43.0000, -75.0000), "NC": (35.7596, -79.0193),
-            "ND": (47.5515, -101.0020), "OH": (40.4173, -82.9071), "OK": (35.4676, -97.5164),
-            "OR": (44.5720, -122.0709), "PA": (40.5908, -77.2098), "RI": (41.6809, -71.5118),
-            "SC": (33.8361, -81.1637), "SD": (44.3668, -100.3538), "TN": (35.7478, -86.6923),
-            "TX": (31.0545, -97.5635), "UT": (39.3210, -111.0937), "VT": (44.5588, -72.5778),
-            "VA": (37.4316, -78.6569), "WA": (47.7511, -120.7401), "WV": (38.4912, -80.9545),
-            "WI": (43.7844, -88.7879), "WY": (43.0759, -107.2903), "DC": (38.9072, -77.0369)
-        }
+        # Convert state code to numeric format for API
+        api_state_code = state_code
+        if len(state_code) == 2 and state_code in self.state_code_mapping:
+            api_state_code = self.state_code_mapping[state_code]
         
-        # Buffer size in degrees to account for state size
-        buffer = 2.0
+        endpoint = f"{EPA_AQS_API_BASE_URL}/list/countiesByState"
         
-        # Find states with centers within or near the bounds
-        states_in_bounds = []
-        for state_code, (lat, lon) in state_centers.items():
-            # Check if state center is close to bounds (including buffer)
-            if (min_lat - buffer) <= lat <= (max_lat + buffer) and (min_lon - buffer) <= lon <= (max_lon + buffer):
-                states_in_bounds.append(state_code)
+        params = {
+            "email": EMAIL,
+            "key": API_KEY,
+            "state": api_state_code
+        }
         
-        return states_in_bounds
-    
+        try:
+            response = requests.get(endpoint, params=params)
+            data = response.json()
+            
+            # Handle the specific response structure we observed
+            counties = []
+            if isinstance(data, dict) and "Data" in data and isinstance(data["Data"], list):
+                counties = data["Data"]
+            
+            # Format as "code: name" for dropdown
+            result = []
+            for c in counties:
+                code = c.get("code")
+                value = c.get("value_represented")
+                if code and value:
+                    result.append(f"{code}: {value}")
+            
+            return result
+        except Exception as e:
+            print(f"Error fetching counties: {e}")
+            return []
+
     def get_parameters(self):
         """Fetch available parameter codes (pollutants)"""
         # If we don't have API credentials, use mock data
@@ -237,7 +237,7 @@ class AirQualityApp:
             print(f"Error fetching parameters: {e}")
             return []
     
-    def get_latest_aqi(self, state_code, parameter_code=None):
+    def get_latest_aqi(self, state_code, county_code=None, parameter_code=None):
         """Fetch the latest AQI data for monitors"""
         # If we don't have API credentials, use mock data
         if not EMAIL or not API_KEY:
@@ -257,6 +257,9 @@ class AirQualityApp:
             "bdate": "20240314",  # Beginning date (YYYYMMDD) - last 30 days
             "edate": "20240414",  # End date (YYYYMMDD) - current date
         }
+        
+        # The county parameter might not be supported here either
+        # We'll filter results by county after getting them
             
         if parameter_code:
             params["param"] = parameter_code
@@ -265,52 +268,61 @@ class AirQualityApp:
             response = requests.get(endpoint, params=params)
             data = response.json()
             
+            # Add detailed debugging
+            print(f"AQI API Response Keys: {list(data.keys()) if isinstance(data, dict) else 'Not a dictionary'}")
+            if isinstance(data, dict) and "Header" in data:
+                print(f"AQI Header type: {type(data['Header'])}, content: {data['Header'][:100]}...")
+            
             # Handle the specific response structure we observed
             aqi_data = []
             if isinstance(data, dict) and "Data" in data and isinstance(data["Data"], list):
                 aqi_data = data["Data"]
+            
+            # Filter by county if provided
+            if county_code and aqi_data:
+                aqi_data = [item for item in aqi_data if item.get('county_code') == county_code]
                 
             return aqi_data
         except Exception as e:
             print(f"Error fetching AQI data: {e}")
             return []
     
-    def create_map(self, center_lat=39.8, center_lon=-98.5, zoom_start=4, parameter_code=None):
-        """
-        Create a map centered on the United States with auto-loading functionality
+    def create_map(self, state_code, county_code=None, parameter_code=None):
+        """Create a map with air quality monitoring stations"""
+        # IMPORTANT: We don't pass county_code to get_monitors anymore since the API doesn't support it
+        monitors = self.get_monitors(state_code, parameter_code=parameter_code)
         
-        Args:
-            center_lat: Initial center latitude (default: center of US)
-            center_lon: Initial center longitude (default: center of US)
-            zoom_start: Initial zoom level (default: 4, showing most of US)
-            parameter_code: Optional parameter code to filter by
-        """
-        # Create a map with a specific width and height
-        m = folium.Map(location=[center_lat, center_lon], zoom_start=zoom_start, width='100%', height=700)
+        if not monitors:
+            return "No monitoring stations found for the selected criteria."
         
-        # Add custom JavaScript to handle map events and load data
-        BoundEventHandler = self.create_bound_event_handler()
-        m.add_child(BoundEventHandler())
+        # Convert to DataFrame for easier manipulation
+        df = pd.DataFrame(monitors)
         
-        # We'll start with some initial data to show (e.g., for the entire US view)
-        # For a real implementation, this might be just the major monitoring stations
-        # For this demo, we'll use California as an example
-        if EMAIL and API_KEY:
-            # For real API, we'd calculate bounds and get actual monitors
-            min_lat, max_lat = 32.0, 42.0  # Approximate bounds for California
-            min_lon, max_lon = -125.0, -114.0
-            initial_monitors = self.get_monitors_by_coordinates(min_lat, max_lat, min_lon, max_lon, parameter_code)
-        else:
-            # For demo without API, use mock data for California
-            initial_monitors = self.mock_get_monitors_by_coordinates(32.0, 42.0, -125.0, -114.0, parameter_code)
+        # Now filter by county if provided - do this AFTER getting the monitors
+        if county_code:
+            print(f"Filtering by county_code: {county_code}")
+            county_code_str = str(county_code)
+            df = df[df['county_code'].astype(str) == county_code_str]
+            print(f"After filtering, {len(df)} monitors remain")
+            
+            if len(df) == 0:
+                return "No monitoring stations found for the selected county."
+        
+        # Create a map centered on the mean latitude and longitude
+        center_lat = df["latitude"].mean()
+        center_lon = df["longitude"].mean()
+        
+        # Create a map with a specific width and height - make it bigger
+        m = folium.Map(location=[center_lat, center_lon], zoom_start=7, width='100%', height=700)
         
-        # Add marker cluster for the initial set
+        # Add a marker cluster
         marker_cluster = MarkerCluster().add_to(m)
         
-        # Get AQI data for California as an example
+        # Get latest AQI data if credentials are provided
         aqi_data = {}
         if EMAIL and API_KEY:
-            aqi_results = self.get_latest_aqi("CA", parameter_code)
+            # Again, don't pass county_code to API
+            aqi_results = self.get_latest_aqi(state_code, parameter_code=parameter_code)
             # Create a lookup dictionary by site ID
             for item in aqi_results:
                 site_id = f"{item['state_code']}-{item['county_code']}-{item['site_number']}"
@@ -318,23 +330,6 @@ class AirQualityApp:
                     aqi_data[site_id] = []
                 aqi_data[site_id].append(item)
         
-        # Add markers for each initial monitoring station
-        self.add_markers_to_cluster(marker_cluster, initial_monitors, aqi_data)
-        
-        # Return map HTML and legend HTML separately
-        map_html = m._repr_html_()
-        
-        # Create legend HTML outside the map
-        legend_html = self.create_legend_html()
-        
-        return {"map": map_html, "legend": legend_html}
-    
-    def add_markers_to_cluster(self, marker_cluster, monitors, aqi_data):
-        """Add markers for the given monitors to the marker cluster"""
-        df = pd.DataFrame(monitors)
-        if df.empty:
-            return
-        
         # Add markers for each monitoring station
         for _, row in df.iterrows():
             site_id = f"{row['state_code']}-{row['county_code']}-{row['site_number']}"
@@ -398,14 +393,14 @@ class AirQualityApp:
             # Create popup content with detailed information
             popup_content = f"""
             <div style="min-width: 300px;">
-                <h3>{row.get('local_site_name', 'Unknown Site')}</h3>
+                <h3>{row['local_site_name']}</h3>
                 <p><strong>Site ID:</strong> {site_id}</p>
                 <p><strong>Address:</strong> {row.get('address', 'N/A')}</p>
                 <p><strong>City:</strong> {row.get('city_name', 'N/A')}</p>
                 <p><strong>County:</strong> {row.get('county_name', 'N/A')}</p>
                 <p><strong>State:</strong> {row.get('state_name', 'N/A')}</p>
-                <p><strong>Parameter:</strong> {row.get('parameter_name', 'N/A')}</p>
-                <p><strong>Coordinates:</strong> {row.get('latitude', 'N/A')}, {row.get('longitude', 'N/A')}</p>
+                <p><strong>Parameter:</strong> {row['parameter_name']}</p>
+                <p><strong>Coordinates:</strong> {row['latitude']}, {row['longitude']}</p>
                 {aqi_readings_html}
             </div>
             """
@@ -419,6 +414,14 @@ class AirQualityApp:
                 popup=popup,
                 icon=folium.Icon(color=color, icon="cloud"),
             ).add_to(marker_cluster)
+        
+        # Return map HTML and legend HTML separately
+        map_html = m._repr_html_()
+        
+        # Create legend HTML outside the map
+        legend_html = self.create_legend_html()
+        
+        return {"map": map_html, "legend": legend_html}
     
     def create_legend_html(self):
         """Create the HTML for the AQI legend"""
@@ -440,147 +443,333 @@ class AirQualityApp:
     
     def get_aqi_category(self, aqi_value):
         """Determine AQI category based on value"""
-        try:
-            aqi = int(aqi_value)
-            if aqi <= 50:
-                return "Good"
-            elif aqi <= 100:
-                return "Moderate"
-            elif aqi <= 150:
-                return "Unhealthy for Sensitive Groups"
-            elif aqi <= 200:
-                return "Unhealthy"
-            elif aqi <= 300:
-                return "Very Unhealthy"
-            else:
-                return "Hazardous"
-        except (ValueError, TypeError):
-            return "Unknown"
+        aqi = int(aqi_value)
+        if aqi <= 50:
+            return "Good"
+        elif aqi <= 100:
+            return "Moderate"
+        elif aqi <= 150:
+            return "Unhealthy for Sensitive Groups"
+        elif aqi <= 200:
+            return "Unhealthy"
+        elif aqi <= 300:
+            return "Very Unhealthy"
+        else:
+            return "Hazardous"
+    
+    def mock_get_counties(self, state_code):
+        """Return mock county data for the specified state"""
+        if state_code in self.mock_counties:
+            counties = self.mock_counties[state_code]
+            return [f"{c['code']}: {c['value']}" for c in counties]
+        else:
+            # Return generic counties for other states
+            return [
+                "001: County 1",
+                "002: County 2",
+                "003: County 3",
+                "004: County 4"
+            ]
     
     def mock_get_parameters(self):
         """Return mock parameter data"""
         return [f"{p['code']}: {p['value_represented']}" for p in self.mock_parameters]
     
-    def mock_get_monitors_by_coordinates(self, min_lat, max_lat, min_lon, max_lon, parameter_code=None):
-        """
-        Mock function to return sample data for development, 
-        filtering by coordinate bounds
-        """
-        # Sample monitors data for different regions
-        all_monitors = []
-        
-        # California monitors (West Coast)
-        ca_monitors = [
-            {
-                "state_code": "06",
-                "county_code": "037",
-                "site_number": "0001",
-                "parameter_code": "88101",
-                "parameter_name": "PM2.5 - Local Conditions",
-                "poc": 1,
-                "latitude": 34.0667,
-                "longitude": -118.2275,
-                "local_site_name": "Los Angeles - North Main Street",
-                "address": "1630 North Main Street",
-                "city_name": "Los Angeles",
-                "county_name": "Los Angeles",
-                "state_name": "California",
-                "cbsa_name": "Los Angeles-Long Beach-Anaheim",
-                "date_established": "1998-01-01",
-                "last_sample_date": "2024-04-10"
-            },
-            {
-                "state_code": "06",
-                "county_code": "037",
-                "site_number": "0002",
-                "parameter_code": "44201",
-                "parameter_name": "Ozone",
-                "poc": 1,
-                "latitude": 34.0667,
-                "longitude": -118.2275,
-                "local_site_name": "Los Angeles - North Main Street",
-                "address": "1630 North Main Street",
-                "city_name": "Los Angeles",
-                "county_name": "Los Angeles",
-                "state_name": "California",
-                "cbsa_name": "Los Angeles-Long Beach-Anaheim",
-                "date_established": "1998-01-01",
-                "last_sample_date": "2024-04-10"
-            },
-            {
-                "state_code": "06",
-                "county_code": "067",
-                "site_number": "0010",
-                "parameter_code": "88101",
-                "parameter_name": "PM2.5 - Local Conditions",
-                "poc": 1,
-                "latitude": 38.5661,
-                "longitude": -121.4926,
-                "local_site_name": "Sacramento - T Street",
-                "address": "1309 T Street",
-                "city_name": "Sacramento",
-                "county_name": "Sacramento",
-                "state_name": "California",
-                "cbsa_name": "Sacramento-Roseville",
-                "date_established": "1999-03-01",
-                "last_sample_date": "2024-04-10"
-            },
-            {
-                "state_code": "06",
-                "county_code": "073",
-                "site_number": "0005",
-                "parameter_code": "88101",
-                "parameter_name": "PM2.5 - Local Conditions",
-                "poc": 1,
-                "latitude": 32.7333,
-                "longitude": -117.1500,
-                "local_site_name": "San Diego - Beardsley Street",
-                "address": "1110 Beardsley Street",
-                "city_name": "San Diego",
-                "county_name": "San Diego",
-                "state_name": "California",
-                "cbsa_name": "San Diego-Carlsbad",
-                "date_established": "1999-04-15",
-                "last_sample_date": "2024-04-10"
+    def mock_get_monitors(self, state_code, county_code=None, parameter_code=None):
+        """Mock function to return sample data for development"""
+        # Get state code in proper format
+        if len(state_code) == 2:
+            # Convert 2-letter state code to numeric format for mock data
+            state_code_mapping = {
+                "CA": "06",
+                "NY": "36",
+                "TX": "48"
             }
-        ]
+            numeric_state_code = state_code_mapping.get(state_code, "01")  # Default to "01" if not found
+        else:
+            numeric_state_code = state_code
+        # Sample data for California
+        if state_code == "CA" or numeric_state_code == "06":
+            monitors = [
+                {
+                    "state_code": "06",
+                    "county_code": "037",
+                    "site_number": "0001",
+                    "parameter_code": "88101",
+                    "parameter_name": "PM2.5 - Local Conditions",
+                    "poc": 1,
+                    "latitude": 34.0667,
+                    "longitude": -118.2275,
+                    "local_site_name": "Los Angeles - North Main Street",
+                    "address": "1630 North Main Street",
+                    "city_name": "Los Angeles",
+                    "cbsa_name": "Los Angeles-Long Beach-Anaheim",
+                    "date_established": "1998-01-01",
+                    "last_sample_date": "2024-04-10"
+                },
+                {
+                    "state_code": "06",
+                    "county_code": "037",
+                    "site_number": "0002",
+                    "parameter_code": "44201",
+                    "parameter_name": "Ozone",
+                    "poc": 1,
+                    "latitude": 34.0667,
+                    "longitude": -118.2275,
+                    "local_site_name": "Los Angeles - North Main Street",
+                    "address": "1630 North Main Street",
+                    "city_name": "Los Angeles",
+                    "cbsa_name": "Los Angeles-Long Beach-Anaheim",
+                    "date_established": "1998-01-01",
+                    "last_sample_date": "2024-04-10"
+                },
+                {
+                    "state_code": "06",
+                    "county_code": "067",
+                    "site_number": "0010",
+                    "parameter_code": "88101",
+                    "parameter_name": "PM2.5 - Local Conditions",
+                    "poc": 1,
+                    "latitude": 38.5661,
+                    "longitude": -121.4926,
+                    "local_site_name": "Sacramento - T Street",
+                    "address": "1309 T Street",
+                    "city_name": "Sacramento",
+                    "cbsa_name": "Sacramento-Roseville",
+                    "date_established": "1999-03-01",
+                    "last_sample_date": "2024-04-10"
+                },
+                {
+                    "state_code": "06",
+                    "county_code": "073",
+                    "site_number": "0005",
+                    "parameter_code": "88101",
+                    "parameter_name": "PM2.5 - Local Conditions",
+                    "poc": 1,
+                    "latitude": 32.7333,
+                    "longitude": -117.1500,
+                    "local_site_name": "San Diego - Beardsley Street",
+                    "address": "1110 Beardsley Street",
+                    "city_name": "San Diego",
+                    "cbsa_name": "San Diego-Carlsbad",
+                    "date_established": "1999-04-15",
+                    "last_sample_date": "2024-04-10"
+                }
+            ]
+        # Sample data for New York
+        elif state_code == "NY" or numeric_state_code == "36":
+            monitors = [
+                {
+                    "state_code": "36",
+                    "county_code": "061",
+                    "site_number": "0010",
+                    "parameter_code": "88101",
+                    "parameter_name": "PM2.5 - Local Conditions",
+                    "poc": 1,
+                    "latitude": 40.7159,
+                    "longitude": -73.9876,
+                    "local_site_name": "New York - PS 59",
+                    "address": "228 East 57th Street",
+                    "city_name": "New York",
+                    "cbsa_name": "New York-Newark-Jersey City",
+                    "date_established": "1999-07-15",
+                    "last_sample_date": "2024-04-10"
+                },
+                {
+                    "state_code": "36",
+                    "county_code": "061",
+                    "site_number": "0079",
+                    "parameter_code": "44201",
+                    "parameter_name": "Ozone",
+                    "poc": 1,
+                    "latitude": 40.8160,
+                    "longitude": -73.9510,
+                    "local_site_name": "New York - IS 52",
+                    "address": "681 Kelly Street",
+                    "city_name": "Bronx",
+                    "cbsa_name": "New York-Newark-Jersey City",
+                    "date_established": "1998-01-01",
+                    "last_sample_date": "2024-04-10"
+                }
+            ]
+        # Sample data for Texas
+        elif state_code == "TX" or numeric_state_code == "48":
+            monitors = [
+                {
+                    "state_code": "48",
+                    "county_code": "201",
+                    "site_number": "0024",
+                    "parameter_code": "88101",
+                    "parameter_name": "PM2.5 - Local Conditions",
+                    "poc": 1,
+                    "latitude": 29.7349,
+                    "longitude": -95.3063,
+                    "local_site_name": "Houston - Clinton Drive",
+                    "address": "9525 Clinton Drive",
+                    "city_name": "Houston",
+                    "cbsa_name": "Houston-The Woodlands-Sugar Land",
+                    "date_established": "1997-09-01",
+                    "last_sample_date": "2024-04-10"
+                },
+                {
+                    "state_code": "48",
+                    "county_code": "113",
+                    "site_number": "0050",
+                    "parameter_code": "44201",
+                    "parameter_name": "Ozone",
+                    "poc": 1,
+                    "latitude": 32.8198,
+                    "longitude": -96.8602,
+                    "local_site_name": "Dallas - Hinton Street",
+                    "address": "1415 Hinton Street",
+                    "city_name": "Dallas",
+                    "cbsa_name": "Dallas-Fort Worth-Arlington",
+                    "date_established": "1998-01-01",
+                    "last_sample_date": "2024-04-10"
+                }
+            ]
+        else:
+            # Default data for other states - generate some random monitors
+            monitors = [
+                {
+                    "state_code": state_code,
+                    "county_code": "001",
+                    "site_number": "0001",
+                    "parameter_code": "88101",
+                    "parameter_name": "PM2.5 - Local Conditions",
+                    "poc": 1,
+                    "latitude": 40.0 + float(ord(state_code[0])) / 10,
+                    "longitude": -90.0 - float(ord(state_code[1])) / 10,
+                    "local_site_name": f"{self.states.get(state_code, 'Unknown')} - Station 1",
+                    "address": "123 Main Street",
+                    "city_name": "City 1",
+                    "cbsa_name": f"{self.states.get(state_code, 'Unknown')} Metro Area",
+                    "date_established": "2000-01-01",
+                    "last_sample_date": "2024-04-10"
+                },
+                {
+                    "state_code": state_code,
+                    "county_code": "002",
+                    "site_number": "0002",
+                    "parameter_code": "44201",
+                    "parameter_name": "Ozone",
+                    "poc": 1,
+                    "latitude": 40.5 + float(ord(state_code[0])) / 10,
+                    "longitude": -90.5 - float(ord(state_code[1])) / 10,
+                    "local_site_name": f"{self.states.get(state_code, 'Unknown')} - Station 2",
+                    "address": "456 Oak Street",
+                    "city_name": "City 2",
+                    "cbsa_name": f"{self.states.get(state_code, 'Unknown')} Metro Area",
+                    "date_established": "2000-01-01",
+                    "last_sample_date": "2024-04-10"
+                }
+            ]
         
-        # New York monitors (East Coast)
-        ny_monitors = [
-            {
-                "state_code": "36",
-                "county_code": "061",
-                "site_number": "0010",
-                "parameter_code": "88101",
-                "parameter_name": "PM2.5 - Local Conditions",
-                "poc": 1,
-                "latitude": 40.7159,
-                "longitude": -73.9876,
-                "local_site_name": "New York - PS 59",
-                "address": "228 East 57th Street",
-                "city_name": "New York",
-                "county_name": "New York",
-                "state_name": "New York",
-                "cbsa_name": "New York-Newark-Jersey City",
-                "date_established": "1999-07-15",
-                "last_sample_date": "2024-04-10"
-            },
-            {
-                "state_code": "36",
-                "county_code": "061",
-                "site_number": "0079",
-                "parameter_code": "44201",
-                "parameter_name": "Ozone",
-                "poc": 1,
-                "latitude": 40.8160,
-                "longitude": -73.9510,
-                "local_site_name": "New York - IS 52",
-                "address": "681 Kelly Street",
-                "city_name": "Bronx",
-                "county_name": "Bronx",
-                "state_name": "New York",
-                "cbsa_name": "New York-Newark-Jersey City",
-                "date_established": "1998-01-01",
-                "last_sample_date": "2024-04-10"
-            }
-        ]
+        # Filter by county if provided
+        if county_code:
+            monitors = [m for m in monitors if m["county_code"] == county_code]
+            
+        # Filter by parameter if provided
+        if parameter_code:
+            monitors = [m for m in monitors if m["parameter_code"] == parameter_code]
+            
+        return monitors
+
+def create_air_quality_map_ui():
+    """Create the Gradio interface for the Air Quality Map application"""
+    app = AirQualityApp()
+    
+    def update_counties(state_code):
+        """Callback to update counties dropdown when state changes"""
+        counties = app.get_counties(state_code)
+        return gr.Dropdown(choices=counties)
+    
+    def show_map(state, county=None, parameter=None):
+        """Callback to generate and display the map"""
+        # Extract code from county string if provided
+        county_code = None
+        if county and ":" in county:
+            county_code = county.split(":")[0].strip()
+            
+        # Extract code from parameter string if provided
+        parameter_code = None
+        if parameter and ":" in parameter:
+            parameter_code = parameter.split(":")[0].strip()
+            
+        # Generate the map
+        result = app.create_map(state, county_code, parameter_code)
+        
+        if isinstance(result, dict):
+            # Combine map and legend HTML
+            html_content = f"""
+            <div>
+                {result["map"]}
+                {result["legend"]}
+            </div>
+            """
+            return html_content
+        else:
+            # Return error message or whatever was returned
+            return result
+    
+    # Create the UI
+    with gr.Blocks(title="Air Quality Monitoring Stations") as interface:
+        gr.Markdown("# NOAA Air Quality Monitoring Stations Map")
+        gr.Markdown("""
+        This application displays air quality monitoring stations in the United States.
+        
+        **Note:** To use the actual EPA AQS API, you need to register for an API key and set 
+        `EPA_AQS_EMAIL` and `EPA_AQS_API_KEY` environment variables in your Hugging Face Space.
+        
+        For demonstration without an API key, the app shows sample data for California (CA), New York (NY), and Texas (TX).
+        """)
+        
+        with gr.Row():
+            with gr.Column(scale=1):
+                # State dropdown with default value
+                state_dropdown = gr.Dropdown(
+                    choices=list(app.states.keys()),
+                    label="Select State",
+                    value="CA"
+                )
+                
+                # County dropdown with mock counties for the default state
+                county_dropdown = gr.Dropdown(
+                    choices=app.mock_get_counties("CA"),
+                    label="Select County (Optional)",
+                    allow_custom_value=True
+                )
+                
+                # Parameter dropdown (pollutant type)
+                parameter_dropdown = gr.Dropdown(
+                    choices=app.mock_get_parameters(),
+                    label="Select Pollutant (Optional)",
+                    allow_custom_value=True
+                )
+                
+                # Button to generate map
+                map_button = gr.Button("Show Map")
+            
+            # HTML component to display the map in a larger column
+            with gr.Column(scale=3):
+                map_html = gr.HTML(label="Air Quality Monitoring Stations Map")
+        
+        # Set up event handlers
+        state_dropdown.change(
+            fn=update_counties,
+            inputs=state_dropdown,
+            outputs=county_dropdown
+        )
+        
+        map_button.click(
+            fn=show_map,
+            inputs=[state_dropdown, county_dropdown, parameter_dropdown],
+            outputs=map_html
+        )
+    
+    return interface
+
+# Create and launch the app
+if __name__ == "__main__":
+    air_quality_map_ui = create_air_quality_map_ui()
+    air_quality_map_ui.launch()