昨天下午三点，办公室突然炸锅了，组长盯着屏幕脸色铁青，我凑过去一看，心凉了半截——原本应该密密麻麻分布着业务网点的 geo 图中所有点不显示，白花花一片，连个标点符号都看不见。那种感觉，就像是你精心策划的生日惊喜，蛋糕上的蜡烛全灭了，只剩下一块空蛋糕。别慌，这种“地图失明”症在GIS开发中太常见了，通常不是什么天塌了，而是几个低级错误导致的。

先说我的第一招，也是最容易忽略的：检查数据源的坐标系。

我这次遇到的坑，纯粹是因为偷懒。前端直接读取后端传来的经纬度，结果后端传过来的是 WGS84 标准经纬度，但我前端地图组件默认用的是 Web 墨卡托投影。数据没错，地图没坏，就是“语言不通”。当你发现 geo 图中所有点不显示时，第一步不是删库跑路，而是打开控制台看原始数据。如果坐标是字符串形式，比如 "116.39"，记得要转成数值类型，有些 JS 库对类型校验很严，字符串会静默失败。我大概花了二十分钟，用 JSON.parse 把数据强行转了一下，刷新页面，噗，点了出来了。

第二步：排查 Z 轴或高程值的问题。

很多小伙伴用 3D 地图，或者某些特殊的 GeoJSON 格式，里面带了 elevation 属性。如果你设置了一个极高或极低的值，比如 999999 米，地图渲染引擎可能会直接丢弃这些点，或者把它们渲染到云层后面去了。我之前就犯过这个错，为了测试特意给点加了个高度，结果忘了改回来，导致整张图空无一物。这时候你去看控制台，可能连报错都没有，这就是最坑的地方。所以，如果 geo 图中所有点不显示，务必打印出其中一个点的所有属性，逐个字段排查，别只看经度纬度。

第三步：CSS 层级和容器遮挡。

这是最“玄学”也最“真实”的一步。有时候代码逻辑完全正确，但地图里的点就是不显示。这时候你要怀疑你的 CSS。我这次的问题出在这里：一个全屏的 Loading 动画，设置了 z-index: 9999，而且 pointer-events 默认是 auto，它虽然看不见，但它像一层隐形玻璃盖在地图上面，拦截了所有渲染事件和绘制请求。我把 Loading 层的 z-index 降到 10，问题瞬间解决。真的，别不信，前端里很多灵异现象，最后都是 CSS 锅。

还有一个小建议，如果你用的是大数据量渲染，比如超过一万个点，浏览器主线程可能卡死，导致渲染超时，看起来就像“没显示”。这时候不要死扛，试试使用 WebGL 加速或者进行数据聚合（Clustering）。别小看聚合，我处理过一个十万级的物流轨迹图，直接渲染卡成 PPT，用了聚合后，流畅得像德芙。

最后说点心里话，做这行几年了，发现越是大项目，越容易在细节上翻车。有时候 geo 图中所有点不显示，真的不是算法不行，可能是某个同事改配置时手滑，把一个布尔值写反了。保持耐心，多打印 Log，多刷新，别让一个小时的卡顿，毁了你的整个下午。

另外提醒一下，如果是跨域问题，CORS 报错有时候会被浏览器吞掉，或者只给个黄色的警告。这时候你得看看 Network 面板里那个红色的请求，是不是 403 或 404。我有一次因为 Nginx 配置漏了一个 header，查了半宿，最后发现是跨域被挡了。

总之，遇到这种情况，深呼吸，按步骤来：查坐标类型、查高程值、查 CSS 遮挡、查网络请求。只要你不慌，地图总会亮起来的。毕竟，我们都是跟代码较劲的普通人，谁还没掉过几个坑呢？