arcgis 加载天地图WMTS服务
arcgis加载天地图的WMTS服务网络上教程也有很多，并且很多GIS开发人员都将其进行了相应的封装，但是大部分对于初学者而言，存在代码不全的情况，因此，这里将真个天地图的WMTS服务地图的加载的代码全部展现出来，方便初学者进行天地图的服务调用。并且在本文中，实现了一个模块对天地图所有MWTS服务调用的封装，具体的代码源代码请见码云（https://gitee.com/MrHuanLiu/TDTLib），本文只对重点进行详解。
对于Dojo 中类的定义及其使用的相关方法请查看(https://dojotoolkit.org/documentation/tutorials/1.10/declare/index.html),
对于矢量图层与影像图层（包括各自注记图层的加载），存在大量代码重复的代码，且不同图层的加载主要是由于天地图服务地址的差异，其余的基本一样，这也是对WMTS服务进行再次封装的基础。下面我将封装模块中的getTileUrl方法返回的天地图服务地址单独摘取出来，你们可以仔细对比一下各自的区别。
- 矢量图层
"http://t" + col % 8 + ".tianditu.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
- 矢量注记图层
"http://t" + row % 8 + ".tianditu.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
- 影像图层
"http://t0.tianditu.com/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL="+ col + "&FORMAT=tiles" ;- 影像注记图层
"http://t0.tianditu.com/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
1.加载所有WMTS服务模块的封装
这个模块的封装和以下的2-5 一样具有共同点，只不过现在我们的一个模块需要完成对矢量图层、矢量注记图层、影像图层、影像注记图层、地形图层、地形注记图层等加载，其中不同注记图层可以有（中文、英文、蒙古文、维吾尔文）等四种注记图层的选择，并且可以选择 坐标 是投影坐标还是地理坐标。（该类源代码及相关说明见 https://gitee.com/MrHuanLiu/TDTLib），这里仅提供一个示例：
Search widget tutorial
2.天地图矢量图层的加载
define(["dojo/_base/declare",
"esri/layers/tiled"],
function (declare) {
return declare(esri.layers.TiledMapServiceLayer, {
constructor: function () {
this.spatialReference = new esri.SpatialReference({wkid: 4326});
this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-180.0, -90.0, 180.0, 90.0, this.spatialReference));
this.tileInfo = new esri.layers.TileInfo({
"rows": 256,
"cols": 256,
"compressionQuality": 0,
"origin": {
"x": -180,
"y": 90
},
"spatialReference": {
"wkid": 4326
},
"lods": [
{"level": 2, "resolution": 0.3515625, "scale": 147748796.52937502},
{"level": 3, "resolution": 0.17578125, "scale": 73874398.264687508},
{"level": 4, "resolution": 0.087890625, "scale": 36937199.132343754},
{"level": 5, "resolution": 0.0439453125, "scale": 18468599.566171877},
{"level": 6, "resolution": 0.02197265625, "scale": 9234299.7830859385},
{"level": 7, "resolution": 0.010986328125, "scale": 4617149.8915429693},
{"level": 8, "resolution": 0.0054931640625, "scale": 2308574.9457714846},
{"level": 9, "resolution": 0.00274658203125, "scale": 1154287.4728857423},
{"level": 10, "resolution": 0.001373291015625, "scale": 577143.73644287116},
{"level": 11, "resolution": 0.0006866455078125, "scale": 288571.86822143558},
{"level": 12, "resolution": 0.00034332275390625, "scale": 144285.93411071779},
{"level": 13, "resolution": 0.000171661376953125, "scale": 72142.967055358895},
{"level": 14, "resolution": 8.58306884765625e-005, "scale": 36071.483527679447},
{"level": 15, "resolution": 4.291534423828125e-005, "scale": 18035.741763839724},
{"level": 16, "resolution": 2.1457672119140625e-005, "scale": 9017.8708819198619},
{"level": 17, "resolution": 1.0728836059570313e-005, "scale": 4508.9354409599309},
{"level": 18, "resolution": 5.3644180297851563e-006, "scale": 2254.4677204799655}
]
});
this.loaded = true;
this.onLoad(this);
},
getTileUrl: function (level, row, col) {
return "http://t" + col % 8 + ".tianditu.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
}
});
});3.天地图矢量注记图层的加载
define(["dojo/_base/declare",
"esri/layers/tiled"],
function (declare) {
return declare(esri.layers.TiledMapServiceLayer, {
constructor: function () {
this.spatialReference = new esri.SpatialReference({wkid: 4326});
this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-180.0, -90.0, 180.0, 90.0, this.spatialReference));
this.tileInfo = new esri.layers.TileInfo({
"rows": 256,
"cols": 256,
"compressionQuality": 0,
"origin": {
"x": -180,
"y": 90
},
"spatialReference": {
"wkid": 4326
},
"lods": [
{"level": 2, "resolution": 0.3515625, "scale": 147748796.52937502},
{"level": 3, "resolution": 0.17578125, "scale": 73874398.264687508},
{"level": 4, "resolution": 0.087890625, "scale": 36937199.132343754},
{"level": 5, "resolution": 0.0439453125, "scale": 18468599.566171877},
{"level": 6, "resolution": 0.02197265625, "scale": 9234299.7830859385},
{"level": 7, "resolution": 0.010986328125, "scale": 4617149.8915429693},
{"level": 8, "resolution": 0.0054931640625, "scale": 2308574.9457714846},
{"level": 9, "resolution": 0.00274658203125, "scale": 1154287.4728857423},
{"level": 10, "resolution": 0.001373291015625, "scale": 577143.73644287116},
{"level": 11, "resolution": 0.0006866455078125, "scale": 288571.86822143558},
{"level": 12, "resolution": 0.00034332275390625, "scale": 144285.93411071779},
{"level": 13, "resolution": 0.000171661376953125, "scale": 72142.967055358895},
{"level": 14, "resolution": 8.58306884765625e-005, "scale": 36071.483527679447},
{"level": 15, "resolution": 4.291534423828125e-005, "scale": 18035.741763839724},
{"level": 16, "resolution": 2.1457672119140625e-005, "scale": 9017.8708819198619},
{"level": 17, "resolution": 1.0728836059570313e-005, "scale": 4508.9354409599309},
{"level": 18, "resolution": 5.3644180297851563e-006, "scale": 2254.4677204799655}
]
});
this.loaded = true;
this.onLoad(this);
},
getTileUrl: function (level, row, col) {
return "http://t" + row % 8 + ".tianditu.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
}
});
});4.天地图影像图层的加载
define(["dojo/_base/declare",
"esri/layers/tiled"],
function (declare) {
return declare(esri.layers.TiledMapServiceLayer, {
constructor: function () {
this.spatialReference = new esri.SpatialReference({wkid: 4326});
this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-180.0, -90.0, 180.0, 90.0, this.spatialReference));
this.tileInfo = new esri.layers.TileInfo({
"rows": 256,
"cols": 256,
"compressionQuality": 0,
"origin": {
"x": -180,
"y": 90
},
"spatialReference": {
"wkid": 4326
},
"lods": [
{"level": 2, "resolution": 0.3515625, "scale": 147748796.52937502},
{"level": 3, "resolution": 0.17578125, "scale": 73874398.264687508},
{"level": 4, "resolution": 0.087890625, "scale": 36937199.132343754},
{"level": 5, "resolution": 0.0439453125, "scale": 18468599.566171877},
{"level": 6, "resolution": 0.02197265625, "scale": 9234299.7830859385},
{"level": 7, "resolution": 0.010986328125, "scale": 4617149.8915429693},
{"level": 8, "resolution": 0.0054931640625, "scale": 2308574.9457714846},
{"level": 9, "resolution": 0.00274658203125, "scale": 1154287.4728857423},
{"level": 10, "resolution": 0.001373291015625, "scale": 577143.73644287116},
{"level": 11, "resolution": 0.0006866455078125, "scale": 288571.86822143558},
{"level": 12, "resolution": 0.00034332275390625, "scale": 144285.93411071779},
{"level": 13, "resolution": 0.000171661376953125, "scale": 72142.967055358895},
{"level": 14, "resolution": 8.58306884765625e-005, "scale": 36071.483527679447},
{"level": 15, "resolution": 4.291534423828125e-005, "scale": 18035.741763839724},
{"level": 16, "resolution": 2.1457672119140625e-005, "scale": 9017.8708819198619},
{"level": 17, "resolution": 1.0728836059570313e-005, "scale": 4508.9354409599309},
{"level": 18, "resolution": 5.3644180297851563e-006, "scale": 2254.4677204799655}
]
});
this.loaded = true;
this.onLoad(this);
},
getTileUrl: function (level, row, col) {
return "http://t0.tianditu.com/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL="+ col + "&FORMAT=tiles" ;
}
});
});5.天地图影像注记图层的加载
define(["dojo/_base/declare",
"esri/layers/tiled"],
function (declare) {
return declare(esri.layers.TiledMapServiceLayer, {
constructor: function () {
this.spatialReference = new esri.SpatialReference({wkid: 4326});
this.initialExtent = (this.fullExtent = new esri.geometry.Extent(-180.0, -90.0, 180.0, 90.0, this.spatialReference));
this.tileInfo = new esri.layers.TileInfo({
"rows": 256,
"cols": 256,
"compressionQuality": 0,
"origin": {
"x": -180,
"y": 90
},
"spatialReference": {
"wkid": 4326
},
"lods": [
{"level": 2, "resolution": 0.3515625, "scale": 147748796.52937502},
{"level": 3, "resolution": 0.17578125, "scale": 73874398.264687508},
{"level": 4, "resolution": 0.087890625, "scale": 36937199.132343754},
{"level": 5, "resolution": 0.0439453125, "scale": 18468599.566171877},
{"level": 6, "resolution": 0.02197265625, "scale": 9234299.7830859385},
{"level": 7, "resolution": 0.010986328125, "scale": 4617149.8915429693},
{"level": 8, "resolution": 0.0054931640625, "scale": 2308574.9457714846},
{"level": 9, "resolution": 0.00274658203125, "scale": 1154287.4728857423},
{"level": 10, "resolution": 0.001373291015625, "scale": 577143.73644287116},
{"level": 11, "resolution": 0.0006866455078125, "scale": 288571.86822143558},
{"level": 12, "resolution": 0.00034332275390625, "scale": 144285.93411071779},
{"level": 13, "resolution": 0.000171661376953125, "scale": 72142.967055358895},
{"level": 14, "resolution": 8.58306884765625e-005, "scale": 36071.483527679447},
{"level": 15, "resolution": 4.291534423828125e-005, "scale": 18035.741763839724},
{"level": 16, "resolution": 2.1457672119140625e-005, "scale": 9017.8708819198619},
{"level": 17, "resolution": 1.0728836059570313e-005, "scale": 4508.9354409599309},
{"level": 18, "resolution": 5.3644180297851563e-006, "scale": 2254.4677204799655}
]
});
this.loaded = true;
this.onLoad(this);
},
getTileUrl: function (level, row, col) {
return "http://t0.tianditu.com/cia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=tiles";
}
});
});