如果你刚入门,想要在页面上加载地图。推举你先去看看官网初学者教程https://developers.arcgis.com/javascript/latest/guide/ 会讲得更详细一点。初始化地图一般需要两步
1,初始化map对象,map对象是管理图层的容器。
let map = new Map();
看看官网对map对象怎样解释
The Map class contains properties and methods for storing, managing, and overlaying layers common to both 2D and 3D viewing. Layers can be added and removed from the map, but are rendered via a MapView (for viewing data in 2D) or a SceneView (for viewing data in 3D).
理解起来意思就是,map对象是图层存放的容器,可以对图层进行管理,比如添加,删除等操作。map对象对于2D,3D场景情形都是通用的。
map对象常见哪些属性呢(只考虑二维情况)
(1)basemap 指定地图地图的底图,一般都会指定一个图层做地图底图,然后地图的默认坐标系为底图坐标系。
(2)layers 操作图层的集合,可以在这里对加入map的图层进行管理
(3)allLayers所有图层,这个属性会把map对象里的basemap ,layers 都会列出来。
2,初始化view对象,绑定dom元素。view对象是底图(basemap),操作图层(layers)和用户交互的桥梁,view对象包含2d,3d的情况,分别用MapView,SceneView构造函数来初始化
let view = new MapView({
container: "viewDiv",
map: map,
center: [-118.80500, 34.02700],
zoom: 13 });
官网解释
A view provides the means of viewing and interacting with the components of a Map. The Map is merely a container, storing the geographic information contained in base layers and operational layers. The View renders the Map and its various layers, making them visible to the user.
view对象提供了查看Map组件并与之交互的方法。map对象仅仅是一个容器,存储了基本图层和操作图层中的地理信息。视图则将渲染地图及其各个图层,从而使用户可见
那我们看看view对象提供了哪些常用属性或接口(主要解释2维的情况MapView)
常用属性
1,animation 视图的动画效果,初始化goTo()方法产生的动画效果,goTo()方法下面介绍
2,center 视图中心,是[x,y]的格式,x,y分别是经度和维度
3,container 这是view对象绑定的dom元素,初始化view需要指定一个div之类的
4,extent 视图范围,传入经纬度范围数组
5,graphics 这个属性允许直接把一个graphic添加到view对象进行管理,graphic一般是会加到graphicLayer
7,map 将初始化好的map对象传入这个属性,然后view对象就可以管理map对象的底图或操作图层了
8,popup 显示地图图层属性信息的弹框
9,resolution 视图的分辨率
10,scale 比例尺
11,spatialReference 坐标系
12,ui 用于放置默认组件,比如放大,缩小,指北针等按钮,你可以在ui添加你自定义组件
13,zoom 视图的图级,一般地图服务会按照很多个等级进行显示,设置zoom后就从当前级别显示地图
常用方法
14,goTo() 用于视图位置跳转,可以跳转到
(1)[x,y]某个坐标位置
(2)Geometry 某个几何对象(点线面)
(3)Graphic 某个图形对象(点线面)
(4)Viewpoint 视点
(5)还可以是target, center, scale and rotation 等属性的组合情形
比如视图5秒之后跳到[-126,49]这个位置
var pt =newPoint({latitude:49,longitude:-126});
var opts = {
duration:5000
};
view.goTo({
target: pt,
zoom:15
}, opts);
15,on()注册视图事件,比如点击,拖拽,鼠标滚轮滚动等
view.on("click", function(event){
// event is the event handle returned after the event fires.
console.log(event.mapPoint);
});
16,toMap()将屏幕坐标转成地图坐标
17,toScreen()将地图坐标转成屏幕坐标
18,when()用于确定视图初始话好了之后,进行操作
19,hitTest() 返回每个图层与指定屏幕坐标相交的元素,经常会用到这个方法哈,用于鼠标点击获取地图图层的要素信息
view对象就介绍这么多吧,在实际开发过程中可能会碰到这些情形,可以试着解决一下
1,添加图层,删除指定图层,调整多个图层的显示顺序(z-index)
2,将地图视图跳转到某个位置,某个几何对象,并加上动画效果
3,清除掉默认是地图组件,比如默认的放大,缩小按钮
4,屏蔽掉地图默认事件,比如双击放大效果
5,点击操作图层某个位置获取该位置的要素信息
网友评论