File size: 1,752 Bytes
44f2887 4c09bc8 0689b5c 4c09bc8 44f2887 4c09bc8 0689b5c 4c09bc8 0689b5c 4c09bc8 0689b5c 4c09bc8 0689b5c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 |
import streamlit as st
import folium
import folium.plugins
from streamlit_folium import st_folium
import json
# Set the map center and zoom level
MAP_CENTER = [35.6895, 139.6917] # Tokyo
ZOOM_LEVEL = 10
# Create a folium map object
m = folium.Map(location=MAP_CENTER, zoom_start=ZOOM_LEVEL)
# Create a DrawControl object
dc = folium.plugins.Draw()
# Set the draw options to allow only polygons and rectangles
# dc.draw_options = {
# "polyline": False,
# "circle": False,
# "circlemarker": False,
# "marker": False,
# }
# Set the edit options to allow editing and deleting
dc.edit_options = {
"edit": True,
"remove": True,
}
# Add the DrawControl object to the map
m.add_child(dc)
# Define a JavaScript function to handle the draw events
draw_events = """
function handleDrawEvent(e) {
// Get the type and layer of the drawn or edited feature
var type = e.layerType;
var layer = e.layer;
// If the feature is a polygon or a rectangle, get its geojson data
if (type === 'polygon' || type === 'rectangle') {
var geojson = layer.toGeoJSON();
// Send the geojson data to Python via Streamlit
streamlit.setComponentValue(geojson);
}
}
"""
# Add the JavaScript function to the HTML header of the map
m.get_root().header.add_child(folium.Element(draw_events))
# Register the JavaScript function to the draw:created and draw:edited events
m.add_child(folium.Element("map.on('draw:created', handleDrawEvent);"))
m.add_child(folium.Element("map.on('draw:edited', handleDrawEvent);"))
# Display the folium map using streamlit
st_folium(m)
# # Get the geojson data from Streamlit
# geojson = st_folium.get_value()
# # Display the geojson data using streamlit
# st.write(geojson)
|