Create app.py

app.py

@@ -0,0 +1,77 @@
+import os
+import streamlit as st
+import folium
+from streamlit_folium import folium_static
+import pandas as pd
+from streamlit.runtime.state import SessionStateProxy
+
+@st.cache_resource
+def load_states():
+    return pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/2011_us_ag_exports.csv")
+
+@st.cache_resource
+def load_cities():
+    return pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/2014_us_cities.csv")
+
+def get_lat_lon(city, state):
+    cities_df = load_cities()
+    city_row = cities_df[(cities_df["City"] == city) & (cities_df["State"] == state)]
+    if not city_row.empty:
+        return city_row["lat"].values[0], city_row["lon"].values[0]
+    return None
+
+# Set the page configuration
+st.set_page_config(page_title="Google Maps 3D", layout="wide")
+
+# Set your Google Maps API key
+api_key = os.getenv("GM_TOKEN")
+
+# Load states data
+states_df = load_states()
+state_codes = sorted(states_df["code"].unique())
+
+# Initialize session state
+if "city" not in st.session_state:
+    st.session_state["city"] = "Mound"
+if "state" not in st.session_state:
+    st.session_state["state"] = "MN"
+
+# Create Streamlit UI elements
+st.title("🌍 Google Maps 3D")
+city = st.text_input("Enter a city 🏙️", value=st.session_state["city"])
+state = st.selectbox("Select a state 🎌", options=state_codes, index=state_codes.index(st.session_state["state"]))
+search_button = st.button("Search 🔍")
+
+# Update session state
+st.session_state["city"] = city
+st.session_state["state"] = state
+
+# Get the latitude and longitude of the selected city and state
+if search_button:
+    lat_lon = get_lat_lon(city, state)
+    if lat_lon:
+        map_center = list(lat_lon)
+        map_zoom = 12
+    else:
+        st.warning(f"Could not find the city '{city}' in the state '{state}'.")
+        map_center = [37.7749, -122.4194]  # Example coordinates for San Francisco
+        map_zoom = 12
+else:
+    map_center = get_lat_lon("Mound", "MN")
+    map_zoom = 12
+
+# Create a Folium map instance
+m = folium.Map(location=map_center, zoom_start=map_zoom)
+
+# Add the Google Maps 3D tile layer
+google_3d_layer = folium.TileLayer(
+    tiles=f"https://tile.googleapis.com/v1/3dtiles/root.json?key={api_key}",
+    attr="Google",
+    name="Google Maps 3D",
+    overlay=True,
+    control=True,
+)
+google_3d_layer.add_to(m)
+
+# Display the Folium map using streamlit-folium
+folium_static(m, width=800, height=600)