SuperMapiClient3DforWebGL教程UrlTemplateImageryProvider

作者&＃xff1a;桔子

本文同步更新于简书文章https://www.jianshu.com/p/c9f50f3247b8

高德、腾讯、百度等都提供在线的瓦片服务&＃xff0c;这一节以添加高德在线影像瓦片服务为例&＃xff0c;讲解UrlTemplateImageryProvider的使用。
首先&＃xff0c;来看接口&＃xff1a;

UrlTemplateImageryProvider的接口设置较多&＃xff0c;就不一一翻译说明。下面直接看如何对接。
先打开高德的地图&＃xff0c;看下高德地图提供的影像服务瓦片的请求结构&＃xff1a;

https://webst02.is.autonavi.com/appmaptile?style&＃61;6&x&＃61;3252&y&＃61;1681&z&＃61;12

通过对这个请求的解析&＃xff0c;可以清晰的看到&＃xff1a;
请求地址&＃xff1a;https://webst02.is.autonavi.com/appmaptile&＃xff0c;其中webst02为服务子域信息
风格&＃xff1a;style&＃61;6
瓦片行列信息&＃xff1a;x&＃61;3252&y&＃61;1681&z&＃61;12
高德影像瓦片的请求很简单明了&＃xff0c;通过查询得知高德地图使用的是标准的web墨卡托投影&＃xff0c;这点相对就很人道。
下面来看代码

var GD &＃61; new Cesium.UrlTemplateImageryProvider({url: &＃39;https://webst0{s}.is.autonavi.com/appmaptile?style&＃61;6&x&＃61;{x}&y&＃61;{y}&z&＃61;{z}&＃39;,tilingScheme:new Cesium.WebMercatorTilingScheme(),subdomains: &＃39;1234&＃39;,
});
viewer.imageryLayers.addImageryProvider(GD);


再把路网加上

小结&＃xff1a;
UrlTemplateImageryProvider的使用过程中发现部分地图的对接相对复杂&＃xff0c;不同的服务请求的规则不一样&＃xff0c;有可能存在自定义参数&＃xff0c;导致在构造url的难以程度不同。