在 leaflet 中，通过 `l.domutil.setposition()` 直接操作地图 pane 会影响所有使用该 pane 的图层；解决方法是为需特殊定位的图层与普通图层（如 geojson）分别分配独立的自定义 pane，从而实现精准控制。
Leaflet 默认将所有图层（如标记、矢量、瓦片）渲染到预设的 panes（如 'markerPane'、'overlayPane'、'mapPane'）中。当你调用 L.DomUtil.setPosition(map.getPane("mapPane"), topLeft) 时，实际是重置了整个 mapPane 的 CSS transform 或 top/left 偏移——这会全局性地偏移所有位于该 pane 中的 DOM 元素，导致后续添加的 GeoJSON 点、线等图层也意外错位。
✅ 正确解法：隔离渲染上下文
不修改共享 pane，而是为不同行为需求的图层创建专属 pane，并显式指定 pane 选项：
// 1. 创建专用 pane（优先级建议设为高于默认 overlayPane，避免被遮挡）
map.createPane('geojson');
map.getPane('geojson').style.zIndex = 410; // 默认 overlayPane 是 400
// 2. 创建 GeoJSON 图层，并强制其所有子元素（包括 circleMarker）进入该 pane
L.geoJson(geoData, {
pointToLayer: (feature, latlng) => L.circleMarker(latlng, {
pane: 'geojson', // ✅ 关键：指定专属 pane
radius: 8,
fillColor: '#FFFF00',
color: '#000',
weight: 1,
opacity: 1,
fillOpacity: 0.8
})
}).addTo(map);⚠️ 注意事项：
- 自定义 pane 必须在图层添加前创建（map.createPane()），否则 pane 选项无效；
- pane 选项仅对支持该配置的图层类生效（如 L.CircleMarker、L.Polygon、L.GeoJSON 的 pointToLayer/style 返回对象）；
- 若图层含多个子类型（如混合点、线、面），需在 style 或 onEachFeature 中统一指定 pane；
- 原有依赖 mapPane 定位的图层（如你的自定义图层）可继续保留在 mapPane 或另建 customPane，确保二者互不干扰。
? 进阶提示：你甚至可以为不同图层组设置不同 zIndex 和 CSS 变换逻辑，例如让某图层始终“贴底”或“浮顶”，而无需触碰全局 pane 偏移——这才是 Leaflet 多 pane 架构的设计本意。通过合理划分 pane，既能满足复杂定位需求，又能保持各图层行为解耦、可维护性强。
