ArcGIS API for JavaScript切换底图

由于小编也是刚接触GIS，也常被网上的各种资源所混淆，关于地图的基本创建就有很多方法。其实无关就是3x和4x版本的不同。3x版本大多是3.33，4x版本为4.16最新版本。以后小编也将采用最新版本。

紧接上一篇的创建几何图形，本文主要讲述BasemapToggle和BasemapGallery这两个API来实现地图底图之间的切换。

简单描述下两个api

BasemapToggle

• 使用： require(["esri/widgets/BasemapToggle"], function(BasemapToggle) { /* code goes here */ });
• 描述： BasemapToggle提供了一个小部件，允许最终用户在两个底图之间切换。切换后的底图设置在视图的 地图对象内。
• 实现及主要参数说明：

var basemapToggle = new BasemapToggle({
  view: view, // view:  对MapView或SceneView的引用。
  nextBasemap: "hybrid" // nextBasemap：底图，下一个切换的底图。
});

BasemapGallery

• 使用： require(["esri/widgets/BasemapGallery"], function(BasemapGallery) { /* code goes here */ });
• 描述： BasemapGallery窗口小部件显示表示来自ArcGIS.com的底图或用户定义的一组地图或图像服务的集合图像。从BasemapGallery中选择新的底图时，地图的底图图层将被删除，并替换为在图库中选择的关联底图的底图图层。
• 实现及主要参数说明：

var basemapGallery = new BasemapGallery({
  view: view
});

通过BasemapToggle实现切换

底图的切换还是需要以地图为前提，map及view都需要保留，通过实例BasemapToggle和在view添加该控件来达到目的。

• 这里截取部分代码片段，结尾会附上完整代码。先来看看效果：

格式工厂 屏幕录像20200723_141948 00_00_00-00_00_30.gif

通过BasemapGallery实现切换

• 使用BasemapGallery允许你从ArcGIS Online组中加载底图，以便可以选择和显示底图。
• 创建一个BasemapGallery小部件并将其配置为从中加载底图ArcGIS Online。将设置view为活动视图，并将设置source为ArcGIS Online门户。将设置url为https://wwww.arcgis.com并将其设置useVectorBasemaps为，true以便从矢量图块组中加载底图。如果将此值设置为该值，false将加载栅格图块底图组

• 效果图：

  
  
  格式工厂 屏幕录像20200723_141105 00_00_00-00_00_30.gif

完整代码

注意，basemapGallery和BasemapToggle是两个独立的方法，不能同时使用！！