为Folium用户状态地图添加离线标记计数器的技术咨询

方法一：直接用Folium注入自定义HTML（最简便，无需额外工具） #

Folium本身没有内置全局统计计数器，但可以直接向地图注入自定义HTML元素实现，步骤如下：

1. 提前统计离线用户数
   在Python脚本里先从采集的数据里算出离线用户总数，比如：

# 假设user_data是你从交换机采集到的用户数据列表，每个元素含status字段
offline_count = len([user for user in user_data if user['status'] == 'offline'])

2. 生成固定位置的计数框HTML
   写一个固定在窗口左上角的方形计数框，样式可按需调整：

counter_html = f"""
<div id="offline-counter" style="position: fixed; top: 20px; left: 20px; background: white; padding: 12px 18px; border-radius: 6px; box-shadow: 0 3px 6px rgba(0,0,0,0.15); z-index: 1000; font-family: Arial, sans-serif; font-size: 14px; font-weight: 600;">
  🔴 离线用户总数: <span style="color: #dc3545;">{offline_count}</span>
</div>
"""

3. 将计数框注入Folium地图
   用Folium自带的Element类把HTML包装后，添加到地图的根HTML节点：

import folium

# 假设你已经生成了基础地图对象map
map.get_root().html.add_child(folium.Element(counter_html))

# 保存地图
map.save('user_status_map.html')

这种方式完全依赖Folium原生功能，计数在Python端预先计算好，地图加载时直接显示静态数值，轻量且稳定。

方法二：动态统计（适配标记动态加载场景） #

如果你的标记是通过JS动态添加的，或者需要实时更新计数，可以在注入的HTML里加一段简单的JS代码，自动统计页面上的离线标记：

counter_html = f"""
<div id="offline-counter" style="position: fixed; top: 20px; left: 20px; background: white; padding: 12px 18px; border-radius: 6px; box-shadow: 0 3px 6px rgba(0,0,0,0.15); z-index: 1000; font-family: Arial, sans-serif; font-size: 14px; font-weight: 600;">
  🔴 离线用户总数: <span id="count">0</span>
</div>
<script>
// 等待地图加载完成后统计
setTimeout(() => {{
  // 假设你给离线标记设置了红色图标，通过图标颜色筛选
  const offlineMarkers = document.querySelectorAll('.leaflet-marker-icon[style*="red"]');
  document.getElementById('count').textContent = offlineMarkers.length;
}}, 1000);
</script>
"""

map.get_root().html.add_child(folium.Element(counter_html))

注：创建离线标记时可以指定颜色：folium.Marker(..., icon=folium.Icon(color='red')).add_to(map)，确保JS能准确筛选。

关于Folium内置功能说明 #

Folium没有专门的全局统计计数器组件，它的MarkerCluster仅做区域聚合，无法直接输出全局总数，所以上述自定义HTML注入是最轻量化的解决方案，不需要额外安装其他Python工具。

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