You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Folium SideBySideLayers问题:标记无法在对应图层单独显示

解决Folium SideBySideLayers标记跨图层显示问题

问题出在你直接把FeatureGroup加到了地图全局,它们不属于左右任何一个瓦片图层的专属区域,所以会同时显示在两侧。要让标记和对应瓦片绑定,需要把瓦片图层+对应标记打包成同一个图层组,再传给SideBySideLayers。

修改后的代码如下:

import folium
from folium import plugins, FeatureGroup, LayerGroup

# 创建地图
m = folium.Map(location=(30, 20), zoom_start=4)

# 1. 创建左侧图层组:包含瓦片+专属标记
layer_left_tile = folium.TileLayer('cartodbpositron', name='Layer Left')
fg_left = FeatureGroup(name='Markers left', show=True)
fg_left.add_child(folium.Marker(location=(35, 25), popup='Left: Point A', icon=folium.Icon(color='blue')))
fg_left.add_child(folium.Marker(location=(34, 24), popup='Left: Point B', icon=folium.Icon(color='blue')))
# 把瓦片和标记打包进同一个LayerGroup
layer_left = LayerGroup(name='Left Group')
layer_left_tile.add_to(layer_left)
fg_left.add_to(layer_left)

# 2. 创建右侧图层组:包含瓦片+专属标记
layer_right_tile = folium.TileLayer('openstreetmap', name='Layer Right')
fg_right = FeatureGroup(name='Markers right', show=True)
fg_right.add_child(folium.Marker(location=(25, 15), popup='Right: Point C', icon=folium.Icon(color='red')))
fg_right.add_child(folium.Marker(location=(26, 16), popup='Right: Point D', icon=folium.Icon(color='red')))
# 打包右侧瓦片和标记
layer_right = LayerGroup(name='Right Group')
layer_right_tile.add_to(layer_right)
fg_right.add_to(layer_right)

# 3. 将打包好的图层组传入SideBySideLayers
sbs = plugins.SideBySideLayers(layer_left=layer_left, layer_right=layer_right)
sbs.add_to(m)

m.save("split_map.html")

关键说明:

  • LayerGroup用来把瓦片图层和对应的标记FeatureGroup合并成一个整体,这样SideBySideLayers会把整个组合图层作为左侧/右侧的显示内容
  • 不需要单独将瓦片或FeatureGroup添加到地图,SideBySideLayers会自动处理它们的加载
  • 滑动分割线时,蓝色标记只会出现在左侧的cartodbpositron图层区域,红色标记仅在右侧openstreetmap区域显示,和你期望的效果一致

内容的提问来源于stack exchange,提问作者Mathieu P.

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.18 04:20:04