|
|
import streamlit as st |
|
|
import streamlit.components.v1 as components |
|
|
import plotly.express as px |
|
|
import geopandas as gpd |
|
|
|
|
|
|
|
|
state_data = { |
|
|
'Minnesota': {'abbreviation': 'MN', 'trivia': '1️⃣ Home to over 10,000 lakes\n2️⃣ Boundary Waters Canoe Area', 'largest_company': 'UnitedHealth Group', 'revenue': 257.1}, |
|
|
'California': {'abbreviation': 'CA', 'trivia': '1️⃣ Known for Hollywood\n2️⃣ Tech Hub: Silicon Valley', 'largest_company': 'Apple', 'revenue': 365.8}, |
|
|
'Washington': {'abbreviation': 'WA', 'trivia': '1️⃣ Home to Microsoft\n2️⃣ Known for Coffee Shops', 'largest_company': 'Amazon', 'revenue': 386.1}, |
|
|
'Tennessee': {'abbreviation': 'TN', 'trivia': '1️⃣ Home to Country Music\n2️⃣ Famous for BBQ', 'largest_company': 'FedEx', 'revenue': 84.2}, |
|
|
'Hawaii': {'abbreviation': 'HI', 'trivia': '1️⃣ Known for Beautiful Beaches\n2️⃣ Unique Culture', 'largest_company': 'Hawaiian Electric Industries', 'revenue': 2.7}, |
|
|
'South Dakota': {'abbreviation': 'SD', 'trivia': '1️⃣ Home to Mount Rushmore\n2️⃣ Known for the Badlands', 'largest_company': 'Sanford Health', 'revenue': 5.1}, |
|
|
} |
|
|
|
|
|
|
|
|
def generate_speech_textarea(text_to_speak): |
|
|
documentHTML5 = ''' |
|
|
<!DOCTYPE html> |
|
|
<html> |
|
|
<head> |
|
|
<title>State Trivia</title> |
|
|
<script type="text/javascript"> |
|
|
function readAloud() {{ |
|
|
const text = document.getElementById("textArea").value; |
|
|
const speech = new SpeechSynthesisUtterance(text); |
|
|
window.speechSynthesis.speak(speech); |
|
|
}} |
|
|
</script> |
|
|
</head> |
|
|
<body> |
|
|
<h1>🔊 State Trivia</h1> |
|
|
<textarea id="textArea" rows="10" cols="80" readonly>''' |
|
|
documentHTML5 = documentHTML5 + text_to_speak |
|
|
documentHTML5 = documentHTML5 + ''' |
|
|
</textarea> |
|
|
<br> |
|
|
<button onclick="readAloud()">🔊 Read Aloud</button> |
|
|
</body> |
|
|
</html> |
|
|
''' |
|
|
components.html(documentHTML5, width=1280, height=500) |
|
|
|
|
|
|
|
|
st.title('United States Trivia 🇺🇸') |
|
|
|
|
|
|
|
|
usa = gpd.read_file(gpd.datasets.get_path('naturalearth_lowres')) |
|
|
usa = usa[usa.continent == 'North America'] |
|
|
|
|
|
|
|
|
selected_state = st.selectbox("Choose a state:", list(state_data.keys())) |
|
|
|
|
|
|
|
|
selected_state_geom = usa[usa.name == selected_state].geometry.iloc[0] |
|
|
|
|
|
|
|
|
fig = px.choropleth(usa, |
|
|
geojson=usa.geometry, |
|
|
locations=usa.index, |
|
|
scope="usa") |
|
|
fig.update_geos(fitbounds="locations") |
|
|
fig.add_trace(px.scatter_geo(lat=[selected_state_geom.centroid.y], |
|
|
lon=[selected_state_geom.centroid.x]).data[0]) |
|
|
st.plotly_chart(fig) |
|
|
|
|
|
|
|
|
with st.expander(f"Show Trivia for {selected_state} 😃"): |
|
|
trivia_text = state_data[selected_state]['trivia'] |
|
|
trivia_text += f"\n🏢 Largest Company: {state_data[selected_state]['largest_company']}\n💵 Revenue: ${state_data[selected_state]['revenue']}B" |
|
|
|
|
|
if st.button('Read Aloud 📢'): |
|
|
generate_speech_textarea(trivia_text) |
|
|
st.markdown(trivia_text) |
|
|
|
