在鼠标单击时从叶图返回纬度、经度值到 python 脚本（流式 Web 应用程序）

Posted 2023-03-29

【中文标题】在鼠标单击时从叶图返回纬度、经度值到 python 脚本（流式 Web 应用程序）

【英文标题】：Returning Latitude, Longitude values from folium map on mouse click to python script (streamlit webapp)

【发布时间】：2020-12-04 09:20:20

【问题描述】：

我正在编写一个 web 应用程序，用户将在其中单击地图并将纬度、经度返回给 python 脚本。 webapp 是在 streamlit 上编写的，对于我使用 folium 的地图。目前，我使用 folium.LatLngPopup() 来获取点击位置的点击纬度，但我很困惑如何在我的 python 脚本中检索值以进行进一步处理。

这是目前的样子：

#code sn-p

import streamlit as st
from streamlit_folium import folium_static
import folium
m = folium.Map()
m.add_child(folium.LatLngPopup())
folium_static(m)

可能没有本地解决方案，但任何解决方法都将受到赞赏！

【问题讨论】：

您对哪个特定部分感到困惑或遇到问题？

将这些纬度经度值从弹出窗口传递给 python 变量。

目前，包只显示Folium地图，不支持双向数据传输。如果这是您想要的功能，我建议在 GitHub 存储库上打开一个问题（我是包开发人员）

嘿，Randy，我用了你的包裹，谢谢你一开始就把它放在那里。我将在 github 上打开一个关于它的问题。但是现在有没有办法处理它，我尝试了很多方法，但是我缺乏 JS 知识和 folium 对 Js->python 通信的限制有点让我实现它。

不，目前没有办法处理它。正如我所说，数据目前只能单向流动，从 Python 到 javascript。没有返回值。

【参考方案1】：

我最近遇到了同样的问题来获取纬度和经度然后打印它或将值保存到变量中。显然，当我尝试创建一个 streamlit.button 时，我发现通常的 streamlit 是静态的，如果单击该按钮，它应该将 1 添加到变量计数器。结果：变量计数器打印为 1，无论我点击了多少。

为了能够接受输入，streamlit 组件应该是'bi-directional'。 我可能无法清楚地解释它，因为我在 python 或 javascript 中仍然是新手，但简而言之，它应该听听值的变化。

解决方案是创建双向组件，后来我发现了这个很棒的 repo streamlit-light-leaflet。要运行它，只需遵循 README.md。假设您已经在虚拟环境中安装了 streamlit，请执行 npm install 和 npm run start。然后在不同的终端/命令行中运行“streamlit run file.py”。从运行 streamlit 的终端单击 url。

如果地图没有显示，请转到my_component/frontend/src/index.tsx 并输入您的 mapbox.com 访问令牌。要获得 accessToken，您应该先注册 mapbox.com。最佳做法是使用 .env 并从那里调用您的 mapbox accessToken，以保持代码更简洁。