Update app.py

app.py

@@ -2,6 +2,8 @@ import streamlit as st
 import streamlit.components.v1 as components
 import geopandas as gpd
 import matplotlib.pyplot as plt
+import plotly.express as px
+import json
 
 # Function to generate HTML with textarea for speech synthesis
 def generate_speech_textarea(text_to_speak):
@@ -43,10 +45,46 @@ def plot_state_outline(state_code):
     plt.title(f"{state_code} State Outline")
     st.pyplot(plt)
 
+# Load the GeoJSON file
+geojson_path = 'gz_2010_us_040_00_500k.json'
+with open(geojson_path, 'r') as file:
+    us_states_geojson = json.load(file)
+
+# Mapping of state codes to state names
+state_names = {
+    'MN': 'Minnesota',
+    'CA': 'California',
+    'WA': 'Washington',
+    'FL': 'Florida',
+    'TX': 'Texas',
+    'NY': 'New York',
+    'NV': 'Nevada'
+}
+
+# Function to display the state outline
+def plot_state_outline(state_code):
+    state_name = state_names.get(state_code, 'Unknown')
+    fig = px.choropleth(locations=[state_name], geojson=us_states_geojson,
+                        featureidkey="properties.NAME",
+                        projection="mercator")
+    fig.update_geos(fitbounds="locations", visible=False)
+    fig.update_layout(title=f"{state_name} State Outline")
+    st.plotly_chart(fig)
+
 # States list and associated icons
 states = ['MN', 'CA', 'WA', 'FL', 'TX', 'NY', 'NV']
 icons = ['🦆', '🌴', '🍎', '🌞', '🤠', '🗽', '🎰']
 
+# Display maps for each state
+for state, icon in zip(states, icons):
+    st.write(f"{icon} {state}")
+    plot_state_outline(state)
+
+    
+# States list and associated icons
+# states = ['MN', 'CA', 'WA', 'FL', 'TX', 'NY', 'NV']
+# icons = ['🦆', '🌴', '🍎', '🌞', '🤠', '🗽', '🎰']
+
 # Main code
 st.title('U.S. States Trivia 🗺️')