地理包不渲染多边形来映射
Geopackage not rendering polygons to map
创建地图的代码:
<div id="map" style="width: 1000px; height: 700px"></div>
<script>
var map = L.map('map').setView([0,0], 1);
L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/streets-v10/tiles/{z}/{x}/{y}?access_token=pk.ey31IjoibnVtaW51czEiLCJhIjoiY2treTN3YzduekdwMDJubXNhMWNpemdicyJ9.McJEAeE0Jbj999Oz4pbsZg', {
attribution: '<a href="https://www.maptiler.com/copyright/" target="_blank">© MapTiler</a> <a href="https://www.openstreetmap.org/copyright" target="_blank">© OpenStreetMap contributors</a>'
}).addTo(map);
var marker = L.marker([18.52, 73.86]).addTo(map);
这是正确创建地图。现在,我正在尝试添加一个包含状态数据的地理包:https://biogeo.ucdavis.edu/data/gadm3.6/gpkg/gadm36_IND_gpkg.zip
当我使用教程代码在地图上绘制河流时,效果很好:
var rivers = L.geoPackageFeatureLayer([], {
geoPackageUrl: 'http://ngageoint.github.io/GeoPackage/examples/rivers.gpkg',
layerName: 'rivers',
style: {color: 'green'}
}).addTo(map);
L.geoJson(stateData).addTo(map);
而且,当我将此状态地理包上传到地理包查看器 https://ngageoint.github.io/geopackage-js/ 时,它会正确绘制所有内容。但是,当我随后尝试在我的地图中实现相同的功能时,地图渲染良好,但没有在地图上绘制州线;根本没有迹象表明甚至存在以下代码:
var stater = L.geoPackageFeatureLayer([], {
geoPackageUrl: 'assets/geospatial/gadm_states.gpkg',
layerName: 'stater',
style: {color: 'red'}
}).addTo(map);
我想可能是因为 gpkg 文件中有多个图层,而我没有正确指定 on 或其他什么,所以我从 GeoPackage Viewer 下载了我想要的图层作为 geojson 文件,那不是'也不工作。有没有人知道出了什么问题?
我认为你在编造 stater
图层的名称。
我已经下载(并解压缩)了 GADM 数据集的一部分,并查看它包含哪些命名层,然后我在上面 运行 ogrinfo
:
$ wget https://biogeo.ucdavis.edu/data/gadm3.6/gpkg/gadm36_ESP_gpkg.zip
[snip]
2021-02-15 10:49:45 (3,56 MB/s) - “gadm36_ESP_gpkg.zip” saved [9767512/9767512]
$ unzip gadm36_ESP_gpkg.zip
Archive: gadm36_ESP_gpkg.zip
inflating: gadm36_ESP.gpkg
inflating: license.txt
$ ogrinfo gadm36_ESP.gpkg
INFO: Open of `gadm36_ESP.gpkg'
using driver `GPKG' successful.
1: gadm36_ESP_0 (Multi Polygon)
2: gadm36_ESP_1 (Multi Polygon)
3: gadm36_ESP_2 (Multi Polygon)
4: gadm36_ESP_3 (Multi Polygon)
5: gadm36_ESP_4 (Multi Polygon)
...因此 geopackage 有五个不同的主题层,命名为 gadm36_ESP_0
到 gadm36_ESP_5
。
现在,我可以将该文件放在一个小型网络服务器中,并设置一些基本的 Leaflet 示例以从 我知道存在的地理包中的一个层加载数据:
var provinces = L.geoPackageFeatureLayer([], {
geoPackageUrl: 'https://ivan.sanchezortega.es/cors/2021-02-15-gpkg/gadm36_ESP.gpkg',
layerName: 'gadm36_ESP_2',
style: {color: 'red'}
}).addTo(map);
...并且 live example 按预期工作:
所以:
- 一定要检查你的 geopackage 的结构,并知道它包含哪些命名层。
- 经常检查你的 browser's console 是否有错误,因为
- 错误的图层名称将导致“NULL 几何列错误”
- 托管 geopackage 的 Web 服务器可能配置错误(例如 HTTPS 或 CORS 问题)
创建地图的代码:
<div id="map" style="width: 1000px; height: 700px"></div>
<script>
var map = L.map('map').setView([0,0], 1);
L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/streets-v10/tiles/{z}/{x}/{y}?access_token=pk.ey31IjoibnVtaW51czEiLCJhIjoiY2treTN3YzduekdwMDJubXNhMWNpemdicyJ9.McJEAeE0Jbj999Oz4pbsZg', {
attribution: '<a href="https://www.maptiler.com/copyright/" target="_blank">© MapTiler</a> <a href="https://www.openstreetmap.org/copyright" target="_blank">© OpenStreetMap contributors</a>'
}).addTo(map);
var marker = L.marker([18.52, 73.86]).addTo(map);
这是正确创建地图。现在,我正在尝试添加一个包含状态数据的地理包:https://biogeo.ucdavis.edu/data/gadm3.6/gpkg/gadm36_IND_gpkg.zip
当我使用教程代码在地图上绘制河流时,效果很好:
var rivers = L.geoPackageFeatureLayer([], {
geoPackageUrl: 'http://ngageoint.github.io/GeoPackage/examples/rivers.gpkg',
layerName: 'rivers',
style: {color: 'green'}
}).addTo(map);
L.geoJson(stateData).addTo(map);
而且,当我将此状态地理包上传到地理包查看器 https://ngageoint.github.io/geopackage-js/ 时,它会正确绘制所有内容。但是,当我随后尝试在我的地图中实现相同的功能时,地图渲染良好,但没有在地图上绘制州线;根本没有迹象表明甚至存在以下代码:
var stater = L.geoPackageFeatureLayer([], {
geoPackageUrl: 'assets/geospatial/gadm_states.gpkg',
layerName: 'stater',
style: {color: 'red'}
}).addTo(map);
我想可能是因为 gpkg 文件中有多个图层,而我没有正确指定 on 或其他什么,所以我从 GeoPackage Viewer 下载了我想要的图层作为 geojson 文件,那不是'也不工作。有没有人知道出了什么问题?
我认为你在编造 stater
图层的名称。
我已经下载(并解压缩)了 GADM 数据集的一部分,并查看它包含哪些命名层,然后我在上面 运行 ogrinfo
:
$ wget https://biogeo.ucdavis.edu/data/gadm3.6/gpkg/gadm36_ESP_gpkg.zip
[snip]
2021-02-15 10:49:45 (3,56 MB/s) - “gadm36_ESP_gpkg.zip” saved [9767512/9767512]
$ unzip gadm36_ESP_gpkg.zip
Archive: gadm36_ESP_gpkg.zip
inflating: gadm36_ESP.gpkg
inflating: license.txt
$ ogrinfo gadm36_ESP.gpkg
INFO: Open of `gadm36_ESP.gpkg'
using driver `GPKG' successful.
1: gadm36_ESP_0 (Multi Polygon)
2: gadm36_ESP_1 (Multi Polygon)
3: gadm36_ESP_2 (Multi Polygon)
4: gadm36_ESP_3 (Multi Polygon)
5: gadm36_ESP_4 (Multi Polygon)
...因此 geopackage 有五个不同的主题层,命名为 gadm36_ESP_0
到 gadm36_ESP_5
。
现在,我可以将该文件放在一个小型网络服务器中,并设置一些基本的 Leaflet 示例以从 我知道存在的地理包中的一个层加载数据:
var provinces = L.geoPackageFeatureLayer([], {
geoPackageUrl: 'https://ivan.sanchezortega.es/cors/2021-02-15-gpkg/gadm36_ESP.gpkg',
layerName: 'gadm36_ESP_2',
style: {color: 'red'}
}).addTo(map);
...并且 live example 按预期工作:
所以:
- 一定要检查你的 geopackage 的结构,并知道它包含哪些命名层。
- 经常检查你的 browser's console 是否有错误,因为
- 错误的图层名称将导致“NULL 几何列错误”
- 托管 geopackage 的 Web 服务器可能配置错误(例如 HTTPS 或 CORS 问题)