ArcGIS for Javascript API 4.X 实现分屏对比中的地图联动功能的实现
来源:互联网 发布:尔雅网络课app 编辑:程序博客网 时间:2024/05/17 16:46
分屏对比的关键就是多个地图的联动,本文将介绍通过ArcGIS for Javascript API 4.X来实现分屏对比中的地图联动功能
首先需要创建多个视图对象
//创建一个mapvar map = new Map({ basemap: 'streets' })//定义一个数据来存放创建多个view,以便后面来批量进行进行操作var views=[]//根据需要来创建多个视图并绑定地图容器div的idfor(var i=0;i<m;i++){ var view = new MapView({ map: map, container: 'map_'+i }) views.push(view); }
view的联动有一个很关键的属性就是extent,通过设置extent就可以设置view的可视化范围。
核心代码
//在页面加载完成后遍历views数组on('load',function(){ views&&views.forEach(function(view){ //定义一个范围变量 var fullextent=null; //设置鼠标滚轮事件 view.on("mouse-wheel",function(e){ //延迟获取范围的函数 window.setTimeout(function(){ //获取操作图层的范围 fullextent=view.extent //遍历所有视图来设置这个范围 views.forEach(function(nview){ nview.extent=fullextent }) },1000) }) //设置鼠标拖拽事件 view.on("drag",function(e){ //获取操作图层的范围 fullextent=view.extent //遍历所有视图来设置这个范围 views.forEach(function(nview){ nview.extent=fullextent }) }) }) })
在4.X API中没有找到一个能监听view状态改变的事件所以用了‘mouse-wheel
’鼠标滚轮事件和‘drag’鼠标拖拽事件共同对view状态进行监听,但是有个小的问题就是鼠标滚轮事件的触发不是在滚动完成而是在滚动开始的时候,所以通过setTimeout来设置鼠标滚轮事件触发函数的延迟时间,最终可以实现。
最终效果:
阅读全文
0 0
- ArcGIS for Javascript API 4.X 实现分屏对比中的地图联动功能的实现
- arcgis js 实现地图联动对比功能
- ArcGIS API for JavaScript实现地图双屏联动
- ArcGIS API for JavaScript实现地图双屏联动
- ArcGIS API for JavaScript实现地图双屏联动
- ArcGIS for Javascript API 4.X 快速实现卷帘功能
- ArcGIS for JavaScript实现地图联动
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现基本的地图功能(一) javascript
- Arcgis for Javascript实现两个地图的联动
- ArcGIS API for JavaScript地图实现Toorbar功能
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现基本的地图功能(一)
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现基本的地图功能(一)
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现基本的地图功能
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现基本的地图功能(一)
- ArcGIS.Server.9.3和ArcGIS API for JavaScript实现基本的地图功能(一)
- ArcGIS.Server.9.3和ArcGIS API for JavaScript地图实现Toorbar功能(四)
- ArcGIS.Server.9.3和ArcGIS API for JavaScript地图实现Toorbar功能(四)
- ArcGIS API for Silverlight实现地图测距功能
- Zynq 7000裸机的lwip 样例程序echo server 实验
- spark convert RDD[Map] to DataFrame
- 根据前序遍历和中序遍历,后序遍历和中序遍历重构二叉树
- QT5每日一学(二)编写QT多窗口程序
- BZOJ 1858: [Scoi2010]序列操作 线段树
- ArcGIS for Javascript API 4.X 实现分屏对比中的地图联动功能的实现
- 我的第一篇博客
- MS sqlserver 数据库异地备份到其他计算机(xp_cmdshell)
- C语言求2个数中较大数
- 2.2.9同步静态方法和synchronized(class)效果一样
- Java笔记之集合框架Collectio与Map各个子类总结
- JAVA中8八数据类型
- 计算fibnacci数列第n个数的几种方法以及性能比较
- linux下使用C++ Json库