文章首发于GISGO | GIS | 地理信息科学 - GIS研究中心：http://www.gisgo.top/
相较于ArcGIS API而言，Openlayers添加天地图和其他第三方的地图服务简单多了。通过ol.layer.Tile调用切片地图服务，因为天地图服务遵循TMS标准，所以在source属性中使用ol.source.XYZ类，服务地址可以在天地图中查看到。
<!DOCTYPE html><html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width" /><link rel="stylesheet" href="libs/openlayers-v3.20.0-dist/ol.css"><script src="libs/openlayers-v3.20.0-dist/ol.js"></script><title></title><style>html,body,#map{width:100%;height:100%}</style></head><body><div id="map" class="map"></div></body><script>var tian_di_tu_satellite_layer = new ol.layer.Tile({title: "天地图卫星影像",visible:false,source: new ol.source.XYZ({url: '/DataServer?T=img_w&x={x}&y={y}&l={z}'})});var tian_di_tu_road_layer = new ol.layer.Tile({title: "天地图路网",source: new ol.source.XYZ({url: "/DataServer?T=vec_w&x={x}&y={y}&l={z}"})});var tian_di_tu_annotation = new ol.layer.Tile({title: "天地图文字标注",source: new ol.source.XYZ({url: '/DataServer?T=cva_w&x={x}&y={y}&l={z}'})});var map = new ol.Map({target: 'map',layers: [tian_di_tu_satellite_layer, tian_di_tu_road_layer, tian_di_tu_annotation],overlays: [],view: new ol.View({center: [106.52714, 29.62487],projection: 'EPSG:4326',zoom: 12}),//比例尺controls: ol.control.defaults()});</script></html>
淘宝店铺：GIS研究中心
