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
            }]

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值