经纬志
首页 / Leaflet / 使用示例

标记与弹出窗口

六个标记、自定义圆点图标、点击弹窗和图层组批量增删,附带点击坐标回显。

Leaflet 1.9.4 · 更新 2026-10-27
源码与运行效果
运行效果

说明

图标用 L.divIcon 画一个 CSS 圆点,省掉 PNG 资源。 所有标记放进一个 L.layerGroup,清空时只调一次 clearLayers(),不需要逐个 remove。

按钮行为
添加一批标记清空后重新添加六个点,验证图层组复用
清空移除全部标记,计数归零
点击标记顶部显示该点名称与经纬度

标记数量到几百个时,逐个添加会明显变慢。这时应该改用聚合插件, 或者只渲染当前视野内的标记。