如何使用 json 文件中的数据在 folium 地图上创建弹出窗口?
How do I create a popup on folium map using data from json file?
如何在我的 folium 地图上创建弹出窗口以显示有关节点的信息?如下所示,我的 folium 地图目前正在从我从 overpass turbo 下载的 json 文件中绘制数据。因此,地图上建筑物的蓝色轮廓。我无法创建一个弹出窗口,这样当用户单击建筑物时,就会出现一个弹出窗口来显示信息,就像在立交桥涡轮增压器中一样。目前,我正在尝试检索下的所有信息
"properties",但我的代码什么也没做,因为当我试图点击建筑物时,点击地图只会放大,而不是弹出窗口。
*PS 我当前的 GUI 基于我发布的另一个问题“”
提供给我的答案
大叶地图
代码
with open('exportBuildings.geojson') as access_json:
read_content = json.load(access_json)
feature_access = read_content['features']
# Creating folium map
for feature_data in feature_access:
buildingName = feature_data['properties']
m = folium.Map(location=[1.400150, 103.910172], titles="Punggol", zoom_start=17)
nodeData = os.path.join('exportFULL.geojson')
folium.GeoJson(nodeData).add_child(folium.Popup(buildingName))
folium.GeoJson(nodeData).add_to(m)
data = io.BytesIO()
m.save(data, close_file=False)
self.view.setHtml(data.getvalue().decode())
JSON 格式
"type": "Feature",
"properties": {
"@id": "way/768461439",
"building": "train_station",
"layer": "1",
"name": "Damai LRT",
"wikidata": "Q7313275",
"wikipedia": "en:Damai LRT station"
},
解释:
问题是您正在创建 2 个 GeoJSON 项目:
<b>folium.GeoJson(nodeData)</b>.add_child(folium.Popup(buildingName))
<b>folium.GeoJson(nodeData)</b>.add_to(m)
在第一个中,您将弹出窗口添加为子项,但未将其添加到地图中,在第二个中,您将其添加到地图中,但它没有弹出窗口,即只会看到一个 GeoJson在没有弹出窗口的地图上。
解决方案:
解决方案是只创建一个 GeoJson,其中添加了项目并将弹出窗口建立为子项:
geo_json = folium.GeoJson(nodeData)
geo_json.add_child(folium.Popup(buildingName))
geo_json.add_to(m)
利用 add_to() 和 add_child() 属性 returns 相同的项目可以简化为:
folium.GeoJson(nodeData).add_to(m).add_child(folium.Popup(buildingName))
或
folium.GeoJson(nodeData).add_child(folium.Popup(buildingName)).add_to(m)
如何在我的 folium 地图上创建弹出窗口以显示有关节点的信息?如下所示,我的 folium 地图目前正在从我从 overpass turbo 下载的 json 文件中绘制数据。因此,地图上建筑物的蓝色轮廓。我无法创建一个弹出窗口,这样当用户单击建筑物时,就会出现一个弹出窗口来显示信息,就像在立交桥涡轮增压器中一样。目前,我正在尝试检索下的所有信息 "properties",但我的代码什么也没做,因为当我试图点击建筑物时,点击地图只会放大,而不是弹出窗口。
*PS 我当前的 GUI 基于我发布的另一个问题“
大叶地图
代码
with open('exportBuildings.geojson') as access_json:
read_content = json.load(access_json)
feature_access = read_content['features']
# Creating folium map
for feature_data in feature_access:
buildingName = feature_data['properties']
m = folium.Map(location=[1.400150, 103.910172], titles="Punggol", zoom_start=17)
nodeData = os.path.join('exportFULL.geojson')
folium.GeoJson(nodeData).add_child(folium.Popup(buildingName))
folium.GeoJson(nodeData).add_to(m)
data = io.BytesIO()
m.save(data, close_file=False)
self.view.setHtml(data.getvalue().decode())
JSON 格式
"type": "Feature",
"properties": {
"@id": "way/768461439",
"building": "train_station",
"layer": "1",
"name": "Damai LRT",
"wikidata": "Q7313275",
"wikipedia": "en:Damai LRT station"
},
解释:
问题是您正在创建 2 个 GeoJSON 项目:
<b>folium.GeoJson(nodeData)</b>.add_child(folium.Popup(buildingName))
<b>folium.GeoJson(nodeData)</b>.add_to(m)
在第一个中,您将弹出窗口添加为子项,但未将其添加到地图中,在第二个中,您将其添加到地图中,但它没有弹出窗口,即只会看到一个 GeoJson在没有弹出窗口的地图上。
解决方案:
解决方案是只创建一个 GeoJson,其中添加了项目并将弹出窗口建立为子项:
geo_json = folium.GeoJson(nodeData)
geo_json.add_child(folium.Popup(buildingName))
geo_json.add_to(m)
利用 add_to() 和 add_child() 属性 returns 相同的项目可以简化为:
folium.GeoJson(nodeData).add_to(m).add_child(folium.Popup(buildingName))
或
folium.GeoJson(nodeData).add_child(folium.Popup(buildingName)).add_to(m)