Mapbox GL JS 支持 WMS-T10=] TMS 吗？

Question

我有一个 WMST 服务，我想在 mapboxgl 地图上显示。下面是一个openlayers的例子：https://openlayers.org/en/latest/examples/wms-time.html

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

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

Answer 1

Mapbox-GL-JS 甚至不支持常规 WMS，更不用说 WMS Time. If you look at the example for WMS，整个 URL 都是硬编码的。

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

Answer 2

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

mapbox-gl WMS 支持有点笨拙，因为 mapbox-gl 总是使用平铺源。因此，对于 WMS，您必须以图块形式检索 WMS 数据。如果需要WMS-Time，可以在WMS请求中添加&time=参数。

TMS 看起来非常像 Google、Bing、MapQuest、OpenStreetMap 提供的事实上的标准图块集，但它们具有 Y 因子 'upside-down'。您可以通过添加选项告诉 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 网格）

Mapbox GL JS 支持 WMS-T10=] TMS 吗？

Does MapboxGLJS support WMS-T and/or TMS?

javascript

mapbox-gl-js