mapbox-gl加载超图iserver发布切片

 如何在mapbox-gl加载超图iserver发布的切片数据。​

超图isever发布数据的形式，跟arcgis server发布的有些不同，在加载时，也有一定的区别，超图在线可测试地图数据网址如下：

​​http://support.supermap.com:8090/iserver/services/map-world/rest/maps/World​​

支持操作如下截图：

mapbox-gl加载iserver发布的切片数据，可以采取以下几种方式：

• tileFeature 矢量切片形式
• tileImage   经纬度切片形式
• zxyTileImage 墨卡托切片形式1、tileFeature 加载​​​http://support.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/mapboxgl/editor.html#mvtVectorTile​​​数据源：

• "sources": {
"vector-tiles": {
"attribution": attribution,
"type": "vector",                   "tiles": [host + "/iserver/services/map-china400/rest/maps/China/tileFeature.mvt?_cache=false&returnAttributes=true&width=512&height=512&viewBounds={bbox-epsg-3857}"]
                },
            },

         加载其中的图层：

   

map.addLayer({
            "id": "China_Boundary",
            "type": "line",
            "source": "vector-tiles",
            "source-layer": "China_Boundary_A_ln@China",
            "paint": {
                "line-color": "hsl(230, 8%, 51%)",
                "line-width": {
                    "base": 1,
                    "stops": [
                        [
                            3,
                            0.5
                        ],
                        [
                            10,
                            2
                        ]
                    ]
                }
            }
        });

2、tileImage   加载

​​http://support.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/mapboxgl/editor.html#01_tiledMapLayer_4326​​

数据源：

tiles: [host + '/iserver/services/map-world/rest/maps/World'],
                            rasterSource: 'iserver'

图层：

 

{
                            id: 'simple-tiles',
                            type: 'raster',
                            source: 'raster-tiles',
                            minzoom: 0,
                            maxzoom: 22
          }

     注意：iserver的切片是以比例尺+X索引+Y索引进行请求的，所以，加载此类图层，需要使用超图基于mapbox-gl的扩展。

tileImage的请求形式：

3、zxyTileImage 加载

​​http://support.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/mapboxgl/editor.html#01_tiledMapLayer​​

数据源：

sources": {
                "raster-tiles": {
                    "attribution": attribution,
                    "type": "raster",
                    "tiles": [host + '/iserver/services/map-china400/rest/maps/China/zxyTileImage.png?z={z}&x={x}&y={y}'],
                    "tileSize": 256
                }
            },

图层：

         

"layers": [{
                "id": "simple-tiles",
                "type": "raster",
                "source": "raster-tiles",
                "minzoom": 0,
                "maxzoom": 22
            }]