Question

我想在mapboxgl地图上显示WMST服务。以下是openlayers示例：https://openlayers.org/en/latest/examples/wms-time.html

MapBoxGLJS有一个例子吗？它也支持TMS吗？我找不到任何关于此的文档或示例...我不确定这是否记录不完整或者该功能是否存在。

如果答案是否定的，那是可以接受的答案。

Answer 1

是的，您可以在mapbox-gl中同时使用WMS和tms。

mapbox-gl WMS支持有点尴尬，因为mapbox-gl总是使用平铺源。因此，对于WMS，您必须将WMS数据检索为切片。如果需要WMS-Time，可以将＆amp; time =参数添加到WMS请求中。

TMS看起来非常像Google，Bing，MapQuest，OpenStreetMap提供的事实上的标准磁贴集，但它们的Y因素是“倒置”。您可以通过添加选项告诉mapbox-gl它应该以不同的方式处理y因子：“scheme”：“tms”。

示例WMS来源：

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8' />
    <title></title>
    <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
    <script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.37.0/mapbox-gl.js'></script>
    <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.37.0/mapbox-gl.css' rel='stylesheet' />
    <style>
        body { margin:0; padding:0; }
        #map { position:absolute; top:0; bottom:0; width:100%; }
    </style>
</head>
<body>

<div id='map'></div>
<script>
var map = new mapboxgl.Map({
    container: 'map', // container id
    style: {
        "version": 8,
        "sources": {
            "wms-tiles": {
                "type": "raster",
                "tiles": [
                "https://geodata1.nationaalgeoregister.nl/luchtfoto/wms?bbox={bbox-epsg-3857}&format=image/png&service=WMS&version=1.1.1&request=GetMap&srs=EPSG:3857&width=256&height=256&styles=default&layers=luchtfoto_jpeg"
                ],
                "tileSize": 256
            }
        },
        "layers": [{
            "id": "aerial-photo",
            "type": "raster",
            "source": "wms-tiles",
            "minzoom": 5,
            "maxzoom": 22
        }]
    },
    center: [5, 52.5], // starting position
    zoom: 10 // starting zoom
});
</script>

</body>
</html>

对于TMS，您可以使用相同的设置，但在源部分设置“scheme”：“tms”：

"source": {
            type: 'vector',
            tiles:["http:/yourserver/geoserver/gwc/service/tms/1.0.0/yourendpoint/{z}/{x}/{y}.pbf"],
            "scheme": "tms",
            "minzoom": 13,
            "maxzoom": 19,
            "bounds": [3.38,50.73,7.2432,53.5455]
        },

（请注意，如果您碰巧使用geoserver作为tms矢量切片服务器，geoserver应该使用512x512网格）

Answer 2

Mapbox-GL-JS甚至不支持常规WMS，更不用说WMS Time了。如果您查看example for WMS，则整个网址都是硬编码的。

Mapbox-GL-JS不支持TMS，TMS是一种围绕原始OSM磁贴服务约定的元数据包装器。 Mapbox的等价物是TileJSON。

MapboxGLJS是否支持WMS-T和/或TMS？

2 个答案: