Folium中两个自定义ClickForMarker组件无法协同工作的问题

Folium本身没有强制限制只能使用一个ClickForMarker宏，但默认的ClickForMarker实现逻辑会导致冲突——它通过直接给地图绑定click事件来生成标记，多个实例的事件绑定会互相覆盖，最终只有最先（或最后，取决于绑定顺序）生效的实例能正常工作。

解决思路 #

要同时实现「FeatureGroup内子组件的点击标记」和「全局地图的点击标记」，需要自定义事件处理逻辑，避免事件覆盖：

• 区分事件作用范围：给FeatureGroup单独绑定点击事件，而非复用全局地图的事件；全局地图的点击事件单独处理，并添加判断逻辑，当点击在FeatureGroup的图层上时优先触发组内逻辑，否则触发全局逻辑。
• 自定义JS模板：不直接使用默认的ClickForMarker，而是编写自定义JS脚本，明确标记添加的目标（是FeatureGroup还是全局地图）。

代码示例 #

自定义支持多场景的点击处理器 #

from folium import Map, FeatureGroup, CircleMarker
from folium.elements import JSCSSMixin

class CustomClickHandler(JSCSSMixin):
    # 自定义JS模板，支持指定标记添加的目标容器
    _template = """
        {% macro script(this, kwargs) %}
            // 给目标容器绑定点击事件
            {{ this.target_container.get_name() }}.on('click', function(e) {
                // 仅当点击的是地图空白区域（全局）或当前组内元素时触发
                if (!e.target || e.target instanceof L.CircleMarker) {
                    var marker = L.marker(e.latlng).addTo({{ this.marker_container.get_name() }});
                    marker.bindPopup('添加至: ' + {{ this.marker_container.get_name() }});
                }
            });
        {% endmacro %}
    """

    def __init__(self, target_container, marker_container):
        super().__init__()
        self.target_container = target_container  # 触发点击的容器（地图/FeatureGroup）
        self.marker_container = marker_container  # 标记要添加到的容器

# 初始化地图
m = Map(location=[45.523, -122.675], zoom_start=13)

# 创建FeatureGroup并添加到地图
fg = FeatureGroup(name="圆形标记组")
m.add_child(fg)

# 给FeatureGroup添加点击逻辑：点击组内区域时，标记添加到该组
fg_click_handler = CustomClickHandler(target_container=fg, marker_container=fg)
fg.add_child(fg_click_handler)

# 给全局地图添加点击逻辑：点击空白区域时，标记添加到全局地图
global_click_handler = CustomClickHandler(target_container=m, marker_container=m)
m.add_child(global_click_handler)

# 往FeatureGroup添加一个圆形标记
CircleMarker(location=[45.523, -122.675], radius=15, color='darkred').add_to(fg)

# 保存地图
m.save('multi_click_map.html')

说明 #

这个自定义处理器通过指定target_container（触发点击的容器）和marker_container（标记归属的容器），避免了事件覆盖问题。点击FeatureGroup内的圆形或其区域时，标记会添加到该组；点击地图空白区域时，标记会添加到全局地图，两者互不干扰。

内容的提问来源于stack exchange，提问作者Geographos