高德、腾讯、百度等都提供在线的瓦片服务,这一节以添加高德在线影像瓦片服务为例,讲解UrlTemplateImageryProvider的使用。
首先,来看接口:
UrlTemplateImageryProvider接口说明
UrlTemplateImageryProvider的接口设置较多,就不一一翻译说明。下面直接看如何对接。
先打开高德的地图,看下高德地图提供的影像服务瓦片的请求结构:
高德地图请求
https://webst02.is.autonavi.com/appmaptile?style=6&x=3252&y=1681&z=12
通过对这个请求的解析,可以清晰的看到:
请求地址:https://webst02.is.autonavi.com/appmaptile,其中webst02为服务子域信息
风格:style=6
瓦片行列信息:x=3252&y=1681&z=12
高德影像瓦片的请求很简单明了,通过查询得知高德地图使用的是标准的web墨卡托投影,这点相对就很人道。
下面来看代码
var GD = new Cesium.UrlTemplateImageryProvider({
url: 'https://webst0{s}.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}',
tilingScheme:new Cesium.WebMercatorTilingScheme(),
subdomains: '1234',
});
viewer.imageryLayers.addImageryProvider(GD);
效果
再把路网加上
高德路网
小结:
UrlTemplateImageryProvider的使用过程中发现部分地图的对接相对复杂,不同的服务请求的规则不一样,有可能存在自定义参数,导致在构造url的难以程度不同。
网友评论