目录
Basemap类介绍
Basemap类是ArcGIS Maps SDK for JavaScript中用于表示地图底图的核心类之一。底图是地图应用程序中用于显示地理数据的背景图层。它提供了基础地理信息，如道路、河流、地貌和地名等。Basemap类提供了一种将地图图层组织成可供用户选择的底图选项的方式。
Basemap类的常用属性
id：底图的唯一标识符，用于识别底图对象。title：底图的标题。thumbnailUrl：底图的缩略图URL。baseLayers：包含底图的图层数组。可以通过add()和remove()方法来添加或移除底图的图层。referenceLayers：包含底图的参考图层数组。参考图层是不可见的图层，用于提供地图上的参考信息。loadError：一个布尔值，表示底图是否加载失败。loaded：一个布尔值，表示底图是否已加载。loadStatus：一个字符串，表示加载操作的状态。状态值包括四类：not-loaded(未加载)、loading(加载中)、loaded(已加载)、failed(加载失败)spatialReference：底图的空间参考
10.portalItem：portalItem实例，底图关联的ArcGIS Online或Portal for ArcGIS项目的对象。该属性提供了与底图相关的更多信息，如标题、描述、缩略图、标签等。
Basemap类的常用方法
cancelLoad()方法：用于取消正在进行中的load()操作。当你在加载底图时需要取消加载操作时，可以使用cancelLoad()方法。如果load()方法正在进行中，调用cancelLoad()方法将取消加载操作。clone()方法：用于创建一个对象的深度克隆。当调用clone()方法时，它会创建一个原始对象的精确副本，包括所有的属性和相关资源。通过在对象上调用clone()方法，我们可以创建一个具有相同配置的对象副本。当我们想要创建一个Basemap实例的副本，同时保留原始对象以供进一步使用或修改时，这会非常有用。destroy()方法：用于销毁Basemap对象以及与之相关的资源，包括它的图层和portalItem（如果有）。调用destroy()方法后，Basemap对象将不再可用，并且释放其所占用的内存和其他系统资源。这个方法在我们不再需要使用Basemap对象时非常有用，它可以帮助我们释放内存并清理相关资源，从而提高应用程序的性能和效率。fromId()方法：用于根据一个已知的基础地图ID创建一个新的Basemap实例。基础地图ID可以是预定义的常见基础地图，如街道地图、卫星影像地图或地形图，也可以是自定义的基础地图。通过调用fromId()方法并提供基础地图ID作为参数，可以很方便地创建一个特定的基础地图实例，而无需手动配置其属性和资源。这对于快速获取特定类型的基础地图非常有用。load()方法：异步加载底图。返回一个Promise对象，可以使用then()方法来处理加载完成后的回调。when()方法：返回一个Promise对象。when()方法允许我们在实例创建后执行操作或处理进一步的操作。它接受一个回调函数作为参数，当实例可用时将执行该函数。可以使用when()来链接额外的操作或执行依赖于实例创建的特定任务。
使用Basemap添加自定义底图
引用Basemap
前面一节我们在vue3中使用ArcGIS API实现了三维地球的加载，这一节我们在此基础上来添加自定义底图，要使用Basemap，我们需要先引入，使用下面的语句引入Basemap
import Basemap from "@arcgis/core/Basemap.js";
引用切片图层
这里我们调用一个在线的地图服务地址http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer，这个地图服务提供的是一个切片服务，因此，我们需要引入切片服务
import TileLayer from "@arcgis/core/layers/TileLayer.js";
创建一个新的Basemap对象
在代码中使用new关键字创建一个Basemap对象，
let basemap = new Basemap({
baseLayers: [
new TileLayer({
url: "http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer",
title: "Basemap"
})
],
title: "basemap",
id: "basemap"
});
上面的代码中，我们使用new方法创建了一个TileLayer对象，该对象表示一个Web切片图层。给TileLayer中的url属性设置我们发布的地图服务的URL字符串，作为底图的图层数据源。
然后，将这个TileLayer对象放入baseLayers数组中，并将该数组作为参数传递给Basemap。这样，我们就创建了一个包含一个图层的底图对象。同时，为这个底图对象设置了标题和ID，标题和ID都设置为"basemap"。
将自定义图层应用到地图视图中
使用new方法创建Map对象，并将其中的basemap属性设置为上面创建的basemap对象
const map = new Map({
basemap: basemap
});
引入并创建Camera对象
如果使用二维地图，这里不需要引入Camera对象，因为这里我们是使用的三维地图，所以需要引入并创建Camera对象
引入Camera
import Camera from "@arcgis/core/Camera.js";
创建Camera对象，并设置初始值
var camera = new Camera({
position: { // 相机位置
x: -123.12,
y: 40.57,
z: 2000 // 高度
},
tilt: 60, // 相机俯仰角
heading: 0 // 相机偏航角
});
引入并创建SceneView对象
SceneView对象是ArcGIS API为我们提供的三维视图场景，使用之前，我们需要先引入
import SceneView from "@arcgis/core/views/SceneView.js";
创建SceneView对象
view = new SceneView({
center: [-118.80500, 34.02700],
zoom: 4,
container: "viewDiv",
map: map,
camera: camera // 设置相机
});
view.ui.components = [];
}
至此，我们已经实现了自定义底图，并创建了三维场景，
运行程序，刷新浏览器，查看效果
好了，今天就先到这里吧，喜欢的小伙伴点赞关注加收藏哦！
