Leafletjs GeoJSON 图层不适用于 Natural Earth 的地图数据答案

【问题标题】：Leafletjs GeoJSON layer is not working for map data from Natural EarthLeafletjs GeoJSON 图层不适用于 Natural Earth 的地图数据
【发布时间】：2018-03-26 10:13:15
【问题描述】：

我正在使用 Leafletjs 使用 OSM 瓦片绘制地理地图。我使用以下 GeoJSON 作为地图层 http://code.highcharts.com/mapdata/1.0.0/custom/world.js，它使用来自 naturalearthdata.com 的数据

但它不起作用。平铺层正确显示。但是没有显示 GeoJSON 数据。我只能在地图上看到一条白线。

var worldMapData = {}; //the geoJson data from http://code.highcharts.com/mapdata/1.0.0/custom/world.js

var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
    osm = L.tileLayer(osmUrl, {
                noWrap: true,
                attribution: "<a href='http://openstreetmap.org'>OpenStreetMap</a>"
            });

var map = L.map('map').setView([0, 0], 1).addLayer(osm);

function style( feature ) {
    return {
        fillColor: '#FFEDA0',
        weight: 2,
        opacity: 1,
        color: 'white',
        dashArray: '3',
        fillOpacity: 0.7
    };
}

map.addLayer(L.geoJson(worldMapData, {style: style}));

我错过了什么吗？上面的 GeoJSON 不符合规范吗？如果没有，我可以从哪里下载所有与leafletjs 兼容的国家/地区的GeoJSON？

[编辑]这是解决上述问题的jsfiddle http://jsfiddle.net/1x1p55fy/

【问题讨论】：

什么是“不工作”？它崩溃了吗？有错误信息吗？它似乎有效，但什么也没显示？你是如何加载数据的？与 Leaflet 交互时，您的代码看起来如何？正如你的问题所写，很难知道发生了什么
@IvanSanchez 补充说明
你是如何初始化worldMapData的？
@IvanSanchez 添加了 jsfiddle 链接
链接文件中的坐标和您在 JSFiddle 中检索到的坐标都不在 WGS84 lat/lng 中，如 required by GeoJSON format。

标签： leaflet openstreetmap geojson

【解决方案1】：

GeoJSON 数据正在正确加载，并按预期显示。但是，关于坐标参考系统，GeoJSON 数据不符合 GeoJSON 规范。让我引用the GeoJSON specs：

所有 GeoJSON 坐标的坐标参考系是地理坐标参考系统，使用 World Geodetic 系统 1984 (WGS 84) [WGS84] 基准，带有经度和纬度单位十进制度。这相当于坐标参考由开放地理空间联盟 (OGC) URN 确定的系统骨灰盒:ogc:def:crs:OGC::CRS84。一个可选的第三位置元素应是高于或低于 WGS 84 参考的高度（以米为单位）椭球体。在没有高程值的情况下，应用程序对高度或深度敏感应该将位置解释为在当地地面或海平面。

注意：替代坐标参考系统的使用是在 [GJ2008] 中指定，但已从该版本中删除该规范因为使用不同的坐标参考系统——尤其是 [GJ2008] 中规定的方式——具有证明存在互操作性问题。一般来说，GeoJSON 处理软件预计无法访问坐标参考系统数据库或具有网络访问权限以协调参考系统转换参数。然而，凡相关各方有事先安排，替代协调可以使用参考系统而不会有数据被泄露的风险被误解了。

如果您仔细查看https://code.highcharts.com/mapdata/custom/world-highres.geo.json（或http://code.highcharts.com/mapdata/1.0.0/custom/world.js）中的数据，您会发现，事实上，坐标不是相对于 WGS84 大地水准面的经纬度，而且有对 EPSG:54003 坐标参考系统（圆柱铣刀）的引用，具有自定义比例和偏移变换。

正如 GeoJSON 规范已经说明的那样，在此不鼓励您在 GeoJSON 数据中使用 EPSG:4326（纬度-经度中的 WGS84）以外的任何其他 CRS。

找到一些符合要求的 GeoJSON，它在 Leaflet 中看起来还不错。 Leaflet 不处理 GeoJSON 数据的重投影，也不处理 highcharts 数据所暗示的比例变换。

【讨论】：