Spaces:
Sleeping
Sleeping
Update app.py
Browse files
app.py
CHANGED
|
@@ -20,12 +20,13 @@ def show_map(source, destination):
|
|
| 20 |
html_code = f"""
|
| 21 |
<html>
|
| 22 |
<head>
|
| 23 |
-
<script src="https://maps.googleapis.com/maps/api/js?key={os.getenv('GOOGLE_KEY')}"></script>
|
| 24 |
<script>
|
|
|
|
| 25 |
function initMap() {{
|
| 26 |
var directionsService = new google.maps.DirectionsService();
|
| 27 |
var directionsRenderer = new google.maps.DirectionsRenderer();
|
| 28 |
-
|
| 29 |
zoom: 7,
|
| 30 |
center: {{lat: 41.85, lng: -87.65}}
|
| 31 |
}});
|
|
@@ -48,14 +49,14 @@ def show_map(source, destination):
|
|
| 48 |
</body>
|
| 49 |
</html>
|
| 50 |
"""
|
| 51 |
-
components.html(html_code, height=600)
|
| 52 |
|
| 53 |
# Initialize Google Maps
|
| 54 |
gmaps = googlemaps.Client(key=os.getenv('GOOGLE_KEY'))
|
| 55 |
|
| 56 |
# Streamlit app
|
| 57 |
st.title('🗺️ Google Maps Directions')
|
| 58 |
-
st.sidebar.header('User Input Features')
|
| 59 |
|
| 60 |
source_location = st.sidebar.text_input("Source Location", "Mound, MN")
|
| 61 |
destination_location = st.sidebar.text_input("Destination Location", "Minneapolis, MN")
|
|
@@ -63,12 +64,13 @@ destination_location = st.sidebar.text_input("Destination Location", "Minneapoli
|
|
| 63 |
if st.sidebar.button('Get Directions'):
|
| 64 |
directions_info = get_directions(source_location, destination_location)
|
| 65 |
for mode, directions in directions_info.items():
|
| 66 |
-
st.write(f"## Directions by {mode.capitalize()}")
|
| 67 |
if directions == "No available routes.":
|
| 68 |
-
st.write(directions)
|
| 69 |
else:
|
| 70 |
for i, step in enumerate(directions):
|
| 71 |
-
st.write(f"{i + 1}. {step['html_instructions']}")
|
| 72 |
|
| 73 |
-
|
|
|
|
| 74 |
show_map(source_location, destination_location)
|
|
|
|
| 20 |
html_code = f"""
|
| 21 |
<html>
|
| 22 |
<head>
|
| 23 |
+
<script src="https://maps.googleapis.com/maps/api/js?key={os.getenv('GOOGLE_KEY')}&callback=initMap" async defer></script>
|
| 24 |
<script>
|
| 25 |
+
var map;
|
| 26 |
function initMap() {{
|
| 27 |
var directionsService = new google.maps.DirectionsService();
|
| 28 |
var directionsRenderer = new google.maps.DirectionsRenderer();
|
| 29 |
+
map = new google.maps.Map(document.getElementById('map'), {{
|
| 30 |
zoom: 7,
|
| 31 |
center: {{lat: 41.85, lng: -87.65}}
|
| 32 |
}});
|
|
|
|
| 49 |
</body>
|
| 50 |
</html>
|
| 51 |
"""
|
| 52 |
+
components.html(html_code, height=600, scrolling=False)
|
| 53 |
|
| 54 |
# Initialize Google Maps
|
| 55 |
gmaps = googlemaps.Client(key=os.getenv('GOOGLE_KEY'))
|
| 56 |
|
| 57 |
# Streamlit app
|
| 58 |
st.title('🗺️ Google Maps Directions')
|
| 59 |
+
st.sidebar.header('📌 User Input Features')
|
| 60 |
|
| 61 |
source_location = st.sidebar.text_input("Source Location", "Mound, MN")
|
| 62 |
destination_location = st.sidebar.text_input("Destination Location", "Minneapolis, MN")
|
|
|
|
| 64 |
if st.sidebar.button('Get Directions'):
|
| 65 |
directions_info = get_directions(source_location, destination_location)
|
| 66 |
for mode, directions in directions_info.items():
|
| 67 |
+
st.write(f"## Directions by {mode.capitalize()} 🛣️")
|
| 68 |
if directions == "No available routes.":
|
| 69 |
+
st.write("❌ " + directions)
|
| 70 |
else:
|
| 71 |
for i, step in enumerate(directions):
|
| 72 |
+
st.write(f"👣 {i + 1}. {step['html_instructions']}")
|
| 73 |
|
| 74 |
+
show_map_button = st.button('Show Directions on Map 🗺️')
|
| 75 |
+
if show_map_button:
|
| 76 |
show_map(source_location, destination_location)
|