Question

我正在尝试使用wmts（来自GeoTiff的GeoServer）来获取Mapbox-GL源。 Mapbox-GL能够创建源和层而不会出现任何错误。但是，不会渲染图层，也不会从图块中查询GeoServer。

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

    // Create raster layer from GeoServer
    map.addSource('rasterTest', {
        'type': 'raster',
        'tiles': 'http://localhost:32769/geoserver/gwc/service/wmts?SERVICE=WMTS&REQUEST=GetTile&LAYER=enview:sample&TILEMATRIX=EPSG:900913:{z}&TILEMATRIXSET=EPSG:900913&format=image%2Fpng&TileCol={x}&TileRow={y}',
        'tileSize': 256,
    });

    map.addLayer({
        'id':1,
        'source': 'rasterTest',
        'type': 'raster',
        'visibility': 'visible',
        'source-layer': 'rasterTest',
    });

    console.log('map:');
    console.log(map);

})

Answer 1

您已将'tiles'列为addSource的选项。我不认为这对光栅来源有效 - 请参阅docs here。相反，你需要一个'url'属性。

接下来的问题是，'url'属性不是像许多映射库那样直接的URL模式，而是包含模式的TileJSON doc的URL（没有足够的链接代表，抱歉！）。在上面的链接中没有正确地说明这一点。

这是我使用Mapbox GL JS 0.15.0的最小WMTS TileJSON文档：https://gist.github.com/georgemarrows/e6eba8207281a93a0fc1

Answer 2

使用wmts LAYER名称更改“source-layer”。

'source-layer': 'enview:sample'或'source-layer': 'sample'

//modified source 
map.on('load', function() {

    // Create raster layer from GeoServer
    map.addSource('rasterTest', {
        'type': 'raster',
        'tiles': 'http://localhost:32769/geoserver/gwc/service/wmts?SERVICE=WMTS&REQUEST=GetTile&LAYER=enview:sample&TILEMATRIX=EPSG:900913:{z}&TILEMATRIXSET=EPSG:900913&format=image%2Fpng&TileCol={x}&TileRow={y}',
        'tileSize': 256,
    });

    map.addLayer({
        'id':'rasterTest',
        'source': 'rasterTest',
        'type': 'raster',
        'visibility': 'visible',
        'source-layer': 'enview:sample' //'rasterTest',
    });

})

用于Mapbox-GL源的wmts（GeoTiff）

2 个答案: