Leaflet添加带字母数字网格的函数仅缩放后生效，如何在图层添加时调用？

• 问题根因：原有window.onload触发时机早于Leaflet地图实例初始化完成时机，且未正确绑定图层添加事件回调，导致初始加载时网格绘制逻辑未生效。
• 修复步骤：

1. 替换原有初始调用逻辑，优先监听Leaflet地图的load事件，保证地图完全就绪后再执行首次绘制，同时添加兜底判断兼容地图已加载完成的场景，原有window.onload代码可以直接删除：

map.on('load', function() {
  setMarkerTextSize(map.getZoom());
  setgridtext(map.getZoom());
});
// 兜底：如果地图已经加载完成，直接执行绘制
if (map._loaded) {
  setMarkerTextSize(map.getZoom());
  setgridtext(map.getZoom());
}

2. 若需要实现「用户在图层控件中勾选网格图层时自动触发绘制」的效果，为textgroup绑定add事件，绑定时机需在将图层添加到overlay控件之后：

textgroup.on('add', function() {
  textgroup.clearLayers();
  const currentZoom = map.getZoom();
  setMarkerTextSize(currentZoom);
  setgridtext(currentZoom);
});

3. 可选性能优化：修改zoomend事件回调，仅当网格图层处于显示状态时才执行重绘，避免无效性能消耗：

map.on('zoomend', function() {
  if (map.hasLayer(textgroup)) {
    textgroup.clearLayers();
    const currentZoom = map.getZoom();
    setMarkerTextSize(currentZoom);
    setgridtext(currentZoom);
  }
});

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