在arcgis api for js中能修改百度地图的样式吗

Posted 2023-05-14

你说的非常正确，但是这也反映出我国的GIS软件的水平确实不行，很多单位使用arcgis api for js主要做的局域网内的应用。偶尔有做的联网的应用，那些数据也是很不重要的。 参考技术A 我有的，戳头像哦。~~！

arcgis api for js入门开发系列十七在线地图（天地图百度地图高德地图）

本篇主要讲述的是利用arcgis api加载互联网在线地图服务资源，简单封装一个底图切换控件js，在线地图包括：天地图、高德地图以及百度地图

前言

关于本篇功能实现用到的 api 涉及类看不懂的，请参照 esri 官网的 arcgis api 3.x for js：esri 官网 api，里面详细的介绍 arcgis api 3.x 各个类的介绍，还有就是在线例子：esri 官网在线例子，这个也是学习 arcgis api 3.x 的好素材。

内容概览

1. 基于 arcgis api 3.x 实现加载在线地图
2. 源代码 demo 下载

本篇主要讲述的是利用 arcgis api 加载互联网在线地图服务资源，简单封装一个底图切换控件 js，在线地图包括：天地图、高德地图以及百度地图，效果图如下：

实现思路

1. 简单的底图切换控件 map.LayerSwitcherToolbar.js 文件，里面自定义加载天地图、高德地图以及百度地图类，其实都是继承 TiledMapServiceLayer类：

• 高德地图：

//高德地图图层扩展
GAODELayer = DObject({
id:null,
esriLayer: null,
esriLayerType:\'road\',
construct: function (options) {
DUtil.extend(this, options);
dojo.declare("GaoDeTiledMapServiceLayer", esri.layers.TiledMapServiceLayer, {
id:null,
layertype: "road",//图层类型
constructor: function (args) {
this.spatialReference = new esri.SpatialReference(MapConfig.mapInitParams.gaode_spatialReference);
DUtil.extend(this, args);
this.fullExtent = new esri.geometry.Extent({
xmin: MapConfig.params_gaode.fullExtent.xmin,
ymin: MapConfig.params_gaode.fullExtent.ymin,
xmax: MapConfig.params_gaode.fullExtent.xmax,
ymax: MapConfig.params_gaode.fullExtent.ymax,
spatialReference: this.spatialReference
});
this.initialExtent = this.fullExtent;
this.tileInfo = new esri.layers.TileInfo(MapConfig.params_gaode);
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 = \'http://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 = \'http://webst0\' + (col % 4 + 1) + \'.is.autonavi.com/appmaptile?style=6&x=\' + col + \'&y=\' + row + \'&z=\' + level;
break;
case "label"://影像标
url = \'http://webst0\' + (col % 4 + 1) + \'.is.autonavi.com/appmaptile?style=8&x=\' + col + \'&y=\' + row + \'&z=\' + level;
break;
default:
url = \'http://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;
}
});
this.esriLayer = new GaoDeTiledMapServiceLayer({id:this.id,layertype:this.esriLayerType});
},
hide: function () {
this.esriLayer.hide();
},
show: function () {
this.esriLayer.show();
}
});

 

• 百度地图：

更多的详情见：GIS之家小专栏

文章尾部提供源代码下载，对本专栏感兴趣的话，可以关注一波