[在MapboxGL上显示的mvt矢量图块

Question

我关注了https://medium.com/@mrgrantanderson/https-medium-com-serving-vector-tiles-from-django-38c705f6

从geoDjango将mvt切片投放到地图框。

带有正在运行的查询

   cursor.execute("SELECT ST_AsMVT(tile) FROM (SELECT osm_id, building, ST_AsMVTGeom(geom, TileBBox(%s, %s, %s, 3857)) FROM  nepal_khokanabuildings ) AS tile", [zoom, x, y])

因为我的模型项目是ESPG：3857

矢量似乎没有加载到地图上，api请求正常运行。我也尝试过从Geoserver提供矢量文件，也没有运气。

这是我的JS文件

var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/light-v10',
zoom: 12,

    center: [85.294688,27.634106],

});
    var mapillarySource = {
      type: 'vector',
      tiles: [
       'http://0.0.0.0:8000/nepal/api/v1/data/nepal/{z}/{x}/{y}.mvt'
        ],
      minzoom: 0,
      maxzoom: 14
  };

map.on('load', function() {

  map.addSource('mapillary', mapillarySource);
  map.addLayer({
      'id': 'mapillary',
      'type': 'fill',
      'source': 'mapillary',
      'source-layer': 'water',
      'paint': {
                "fill-color": "#00ffff"

      }
  });
});
map.addControl(new mapboxgl.NavigationControl());
</script>

Answer 1

有很多问题可能表现为“我的图层未显示”。

您可以检查以下所有内容：

• 是否在地图准备好之前创建了图层？ （等待"load"事件）
• 是否生成了正确的图块请求？
• 那些请求成功了吗？
• 它们是否返回实际的.pbf文件？
• 它们是否在正确的位置和正确的投影中包含数据？
• 它们是否包含具有您期望名称的图层？ （在这种情况下为“水”）
• 它们是否包含您期望的类型的数据？ （在这种情况下为多边形）

我对0.0.0.0主机感到好奇，但也怀疑层名称可能不正确。

如果瓦片请求成功，则可以尝试使用https://stevage.github.io/vector-inspector/进行检查，尽管该页面在HTTPS上投放而本地瓦片在HTTP上可能存在问题。