高端网站建设南宁,wordpress 黑链,内蒙古呼和浩特天气预报,中国装饰公司十大排名目录 Basemap类介绍Basemap类的常用属性Basemap类的常用方法 使用Basemap添加自定义底图引用Basemap引用切片图层创建一个新的Basemap对象将自定义图层应用到地图视图中引入并创建Camera对象引入并创建SceneView对象 Basemap类介绍
Basemap类是ArcGIS Maps SDK for JavaScript… 目录 Basemap类介绍Basemap类的常用属性Basemap类的常用方法 使用Basemap添加自定义底图引用Basemap引用切片图层创建一个新的Basemap对象将自定义图层应用到地图视图中引入并创建Camera对象引入并创建SceneView对象 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 [];
}至此我们已经实现了自定义底图并创建了三维场景 运行程序刷新浏览器查看效果 好了今天就先到这里吧喜欢的小伙伴点赞关注加收藏哦
