高德sdk android加载3857,ArcGIS API for JavaScript 加载高德地图代码教程

前言

加载高德作为底图

切片线划图层

gaodelayer.js

define(["dojo/_base/declare",

"esri/geometry/extent",

"esri/spatialreference",

"esri/geometry/point",

"esri/layers/tileinfo",

"esri/layers/tiledmapservicelayer"], function (declare, extent, spatialreference, point, tileinfo, tiledmapservicelayer) {

return declare("gaodelayer", tiledmapservicelayer, {

layertype: "road",//图层类型

constructor: function (args) {

this.spatialreference = new spatialreference({

wkid: 3857

});

declare.safemixin(this, args);

this.fullextent = new extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, this.spatialreference);

this.initialextent = this.fullextent;

this.tileinfo = new tileinfo({

"cols": 256,

"rows": 256,

"compressionquality": 0,

"origin": new point(-20037508.342787, 20037508.342787, this.spatialreference),

"spatialreference": this.spatialreference,

"lods": [{

"level": 0,

"resolution": 156543.033928,

"scale": 591657527.591555

}, {

"level": 1,

"resolution": 78271.5169639999,

"scale": 295828763.795777

}, {

"level": 2,

"resolution": 39135.7584820001,

"scale": 147914381.897889

}, {

"level": 3,

"resolution": 19567.8792409999,

"scale": 73957190.948944

}, {

"level": 4,

"resolution": 9783.93962049996,

"scale": 36978595.474472

}, {

"level": 5,

"resolution": 4891.96981024998,

"scale": 18489297.737236

}, {

"level": 6,

"resolution": 2445.98490512499,

"scale": 9244648.868618

}, {

"level": 7,

"resolution": 1222.99245256249,

"scale": 4622324.434309

}, {

"level": 8,

"resolution": 611.49622628138,

"scale": 2311162.217155

}, {

"level": 9,

"resolution": 305.748113140558,

"scale": 1155581.108577

}, {

"level": 10,

"resolution": 152.874056570411,

"scale": 577790.554289

}, {

"level": 11,

"resolution": 76.4370282850732,

"scale": 288895.277144

}, {

"level": 12,

"resolution": 38.2185141425366,

"scale": 144447.638572

}, {

"level": 13,

"resolution": 19.1092570712683,

"scale": 72223.819286

}, {

"level": 14,

"resolution": 9.55462853563415,

"scale": 36111.909643

}, {

"level": 15,

"resolution": 4.77731426794937,

"scale": 18055.954822

}, {

"level": 16,

"resolution": 2.38865713397468,

"scale": 9027.977411

}, {

"level": 17,

"resolution": 1.19432856685505,

"scale": 4513.988705

}, {

"level": 18,

"resolution": 0.597164283559817,

"scale": 2256.994353

}, {

"level": 19,

"resolution": 0.298582141647617,

"scale": 1128.497176

}]

});

this.loaded = true;

this.onload(this);

},

/**

* 根据不同的laytype返回不同的图层

* @param level

* @param row

* @param col

* @returns {string}

*/

gettileurl: function (level, row, col) {

var url = "";

switch (this.layertype) {

case "road":

url = 'https://webrd0' + (col % 4 + 1) + '.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x=' + col + '&y=' + row + '&z=' + level;

break;

case "st":

url = 'https://webst0' + (col % 4 + 1) + '.is.autonavi.com/appmaptile?style=6&x=' + col + '&y=' + row + '&z=' + level;

break;

case "label":

url = 'https://webst0' + (col % 4 + 1) + '.is.autonavi.com/appmaptile?style=8&x=' + col + '&y=' + row + '&z=' + level;

break;

default:

url = 'https://webrd0' + (col % 4 + 1) + '.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x=' + col + '&y=' + row + '&z=' + level;

break;

}

return url;

}

});

});

在首页集成

arcgis js加载高德地图

html,body{

height: 100%;

}

#map{

height: 100%;

}

var dojoconfig = {

async: false, //是否异步

parseonload: true,

packages: [{ //解释：require(["js/.."],function(){}) 中 js/ 即为 location的值

name: "js", //对应require引用包里的js

location: location.pathname.replace(/\/[^/]*$/, '') + '/js' //对应的路径

}]

};

//地图控件

var map;

require(["esri/map", "js/gaodelayer", "dojo/domready!"], function (map, gaodelayer) {

map = new map("map", {

center: [118.15, 31.55],

zoom: 11,

logo : false, //logo

slider : false //缩小按钮

});

// var baselayer = new gaodelayer();//默认加载矢量 new gaodelayer({layertype:"road"});也可以

// var baselayer = new gaodelayer({layertype: "st"});//加载卫星图

var baselayer = new gaodelayer({layertype: "label"});//加载标注图

map.addlayer(baselayer);//添加高德地图到map容器

});

结果：