GeminiAi/googlemap

1import streamlit as st2 3def main():4    st.title("Advanced Google Maps Integration in Streamlit")5 6    # Enable session state7    st.session_state.lat = None8    st.session_state.lng = None9 10    # Set initial location to New York City11    initial_location = (40.7128, -74.0060)12 13    # Display Google Map with a location picker using HTML and JavaScript14    st.write("Pick a location on the map:")15    map_code = f"""16        <iframe17            id="map"18            width="800"19            height="500"20            frameborder="0"21            scrolling="no"22            marginheight="0"23            marginwidth="0"24            src="https://maps.google.com/maps?q={initial_location[0]},{initial_location[1]}&z=15&output=embed"25            onclick="captureLatLng(event)"26        ></iframe>27        <p id="selected-coordinates">Selected Coordinates: </p>28        <script>29            function captureLatLng(event) {{30                var lat = event.latLng.lat();31                var lng = event.latLng.lng();32                var message = 'Selected Coordinates: ' + lat + ', ' + lng;33                document.getElementById('selected-coordinates').innerHTML = message;34                Streamlit.setSessionState({{ lat: lat, lng: lng }});35            }}36        </script>37    """38    st.components.v1.html(map_code, height=600, scrolling=True)39 40    # Get the selected coordinates from the session state41    selected_coordinates = st.session_state.lat, st.session_state.lng42    if selected_coordinates[0] is not None and selected_coordinates[1] is not None:43        st.write(f"Selected Coordinates: {selected_coordinates[0]}, {selected_coordinates[1]}")44 45if __name__ == "__main__":46    main()47