ECharts 地图为什么显示空白？

常见原因有三个：一是 GeoJSON 未正确注册或注册名与 series 的 map 值不一致；二是几何数据不完整，例如只取了 Feature 而未构成合法的 FeatureCollection；三是坐标数值异常，例如数据其实是投影坐标而非经纬度，导致图形被绘制在可视范围之外，看起来像空白。建议先打印 GeoJSON 的几何类型与坐标范围确认。

ECharts 地图区块有颜色但数值全部对不上，是什么原因？

名称匹配失败。ECharts 默认按名称关联业务数据与边界，两边写法不一致时不会报错，只是不生效。常见差异包括后缀有无、「自治州」「地区」等被简写、别名与全称混用。建议改用行政区划代码关联，或建立一张名称映射表，并在流程中加校验把未命中的单元全部打印出来核对。

ECharts 下钻到县级需要准备多少份数据？

取决于组织方式。按需加载只需一份全国省级数据加上各省的市级数据，区县数据在点击时再请求，总量最小；预置方式则要把每个市的下级区县边界都切分打包，全国范围内是数百个文件，通常按省分目录组织，而不是打进单个主文件。

边界数据的顶点太密会影响加载吗？

会，且影响明显。全国县级边界若使用印刷级精度，文本体积可能达到数十兆，浏览器解析与首次绘制会有可感知的等待。通行做法是按显示比例尺对顶点做抽稀、按层级拆分加载、传输层启用压缩，必要时使用坐标相对编码。用于印刷的数据则保留完整精度，两者分开管理。

热力图与填色图可以叠加在同一张地图上吗？

可以。填色图用 map 系列按区块上色，热力图用 heatmap 系列按点位密度渲染，两者共用同一个 GEO 坐标系即可叠加，用 geoIndex 指定共用底图。需要注意的是，热力图在行政区中心点标注时容易集中在省会等大城市，若要反映区域数值分布，用填色图更准确。

ECharts 地图数据准备：GeoJSON 格式与下钻实现

技术专栏 · 可视化 · 2026-09-20

registerMap 需要什么样的 GeoJSON

ECharts 通过 registerMap 注册地图，接受标准 GeoJSON 的 FeatureCollection。要让渲染结果正常，数据需要满足几个条件：

几何类型为 Polygon 或 MultiPolygon：海岛、飞地必须以 MultiPolygon 表示，若被拆成多个独立 Feature，同一行政区会被当成多个单元。
坐标系为 WGS84 或 GCJ-02，并与底图一致：ECharts 默认不加载底图，纯边界渲染时坐标系无感知；一旦叠加瓦片底图，坐标系必须与瓦片相符，否则整体偏移。
带有用于匹配的名称字段：通常是 properties.name。这个字段的写法决定了后续能否与业务数据对齐。
几何有效、无自相交：存在自相交或重复顶点的面在渲染时可能出现填充异常，表现为区块内部出现空白。

名称对齐：最容易出错的一步

ECharts 默认按行政区名称把 series.data 的 name 与 GeoJSON 的 properties.name 关联。这一步失败的表现是：地图画出来了，但没有任何数值对应的颜色，控制台也不报错。

常见的失配来自三类差异：一是后缀不同，「XX市」与「XX」在两边写法不一致；二是特殊类型被简写，如「自治州」「地区」「盟」被省略或改写成「州」；三是别名与全称混用，例如把「呼和浩特市」写成「呼和浩特」。稳妥的做法不是逐条手工改名，而是在数据侧建立一张映射表，把业务表的名称统一映射到边界数据的名称，并在构建流程中加一道校验：映射后未命中的单元全部打印出来，人工确认。

更可靠的做法是改用行政区划代码匹配。若边界数据的属性表里带代码字段，直接在业务数据与边界之间用代码关联，可以绕开所有命名差异。取用数据时留意字段是否包含代码，可以省掉大量匹配工作。

下钻的数据怎么组织

下钻的本质是「点某个区划，换一份更细的边界加对应的业务数据」。实现上有两种组织方式：

按需加载：点击时再请求该区划的下级边界数据，首次加载最快，适合层级深、范围大的场景。代价是需要处理加载状态与请求失败，且必须保证下级数据的接口按区划代码组织。
预置多份：把各级边界文件预先切分好，按 省/市/区县 的层级命名并使用 GeoJSON 的 encodeOffsets 压缩，一次打包。切换时无等待，适合演示环境与网络不稳定的现场。

下钻到县级时需要注意文件数量的增长——全国范围内每个省下都有一份市级集合、每个市下都有一份区县集合。因此下钻数据通常按省切分打包，而不是一次性打进主文件。

大数据量的性能处理

顶点简化：网页渲染不需要印刷级精度。按显示比例尺做抽稀，通常能把几何体积减少一半以上而不影响观感。
分级加载：全国视图只加载省级，进入某省后再加载该省的地市级，逐级下沉。避免一次性把全国县级数据交给浏览器。
压缩与编码：GeoJSON 文本压缩率高，传输层启用 gzip；ECharts 也支持对坐标串做相对编码以减少体积。
关闭不必要的动效：大数据量下的入场动画与高亮过渡会明显拖慢交互，按需保留即可。

数据来源与取用

用于 ECharts 的边界数据，本站按省市区县、乡镇街道、村三级分别整理，统一为 WGS84（EPSG:4326），带名称与代码字段，做过拓扑清洗。取用前可在地图工作台预览范围与顶点密度是否适合前端渲染，再按省 / 市 / 区县边界包或乡镇街道边界取用。

若下钻最终要落到汇报材料上，可参考《行政区划填色图制作指南》中三条路线的对比。

常见问题

ECharts 地图为什么显示空白？: 常见原因有三个：一是 GeoJSON 未正确注册或注册名与 series 的 map 值不一致；二是几何数据不完整，例如只取了 Feature 而未构成合法的 FeatureCollection；三是坐标数值异常，例如数据其实是投影坐标而非经纬度，导致图形被绘制在可视范围之外，看起来像空白。建议先打印 GeoJSON 的几何类型与坐标范围确认。
ECharts 地图区块有颜色但数值全部对不上，是什么原因？: 名称匹配失败。ECharts 默认按名称关联业务数据与边界，两边写法不一致时不会报错，只是不生效。常见差异包括后缀有无、「自治州」「地区」等被简写、别名与全称混用。建议改用行政区划代码关联，或建立一张名称映射表，并在流程中加校验把未命中的单元全部打印出来核对。
ECharts 下钻到县级需要准备多少份数据？: 取决于组织方式。按需加载只需一份全国省级数据加上各省的市级数据，区县数据在点击时再请求，总量最小；预置方式则要把每个市的下级区县边界都切分打包，全国范围内是数百个文件，通常按省分目录组织，而不是打进单个主文件。
边界数据的顶点太密会影响加载吗？: 会，且影响明显。全国县级边界若使用印刷级精度，文本体积可能达到数十兆，浏览器解析与首次绘制会有可感知的等待。通行做法是按显示比例尺对顶点做抽稀、按层级拆分加载、传输层启用压缩，必要时使用坐标相对编码。用于印刷的数据则保留完整精度，两者分开管理。
热力图与填色图可以叠加在同一张地图上吗？: 可以。填色图用 map 系列按区块上色，热力图用 heatmap 系列按点位密度渲染，两者共用同一个 GEO 坐标系即可叠加，用 geoIndex 指定共用底图。需要注意的是，热力图在行政区中心点标注时容易集中在省会等大城市，若要反映区域数值分布，用填色图更准确。

延伸阅读：《行政区划填色图制作指南：ECharts、Leaflet 与 PPT 三条路线》、《GeoJSON 与 Shapefile 怎么选：结构、编码与场景对照》、《省市区县边界数据下载：粒度选择与字段说明》。