arcgis js之地图分屏同步
arcgis js之地图分屏同步
原理:
新建两个map两个view或者一个map两个view。对地图进行移动事件绑定,在地图移动时同步地图方位
代码:
views.forEach((view) => {
// 定义一个范围变量
let fullextent = null
// 设置鼠标滚轮事件
view.on('mouse-wheel', (e) => {
// 延迟获取范围的函数
window.setTimeout(() => {
// 获取操作图层的范围
fullextent = view.extent
// 遍历所有视图来设置这个范围
views.forEach((nview) => {
nview.extent = fullextent
})
}, 1000)
})
// 设置鼠标拖拽事件
view.on('drag', (e) => {
// 获取操作图层的范围
fullextent = view.extent
// 遍历所有视图来设置这个范围
views.forEach((nview) => {
nview.extent = fullextent
})
})
注:
views是两个view的数组:
let views = [this.view, this.referview]
钻研不易,转载请注明出处......
arcgis js之地图分屏同步的更多相关文章
- arcgis api for js入门开发系列六地图分屏对比(含源代码)
上一篇实现了demo的地图标绘模块,本篇新增地图地图分屏对比模块,截图如下(源代码见文章底部): 对效果图的简单介绍一下,在demo只采用了两分屏对比,感兴趣的话,可以在两分屏的基础上拓展,修改css ...
- arcgis api 3.x for js 入门开发系列六地图分屏对比(附源码下载)
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...
- ArcGIS Pro开发Web3D应用(2)——地图分屏对比(多屏对比)思路
很多应用中都需要用到地图联动.多屏对比.二三维分屏.大屏显示,有图形可视化的地方就有事件响应触发:鼠标按下.移动.鼠标滚轮,由此触发了地图上坐标或范围的变化,将这些变化发送给另一个地图并响应这些变化, ...
- leaflet-webpack 入门开发系列三地图分屏对比(附源码下载)
前言 leaflet-webpack 入门开发系列环境知识点了解: node 安装包下载webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载地址 w ...
- arcgis api for js回调函数如何等待同步
arcgis js开发往往会遇到同步异步的问题,有可能在上一步使用了arcgis js模块回调函数,下一步需要用上一步回调函数的结果,但是因为JavaScript是异步执行的,它并不会等待上一步的回调 ...
- 基于jquery的页面分屏切换模板
闲来无事,搞了个页面的分屏效果,先来看下效果: 出于可自定义宽高的目的,屏幕分块由CSS控制,由js控制估计等分模块效果一般. 程序相关说明: HTML结构: <div class=" ...
- Arcgis API for JS——普通分屏联动及二三维联动
对于二三维联动,有多种方法进行实现,当时旧项目使用了当时能掌握的一种写法,在技能提升了这么多后当然要对这些写法做一个总结. 一.通过监听View上的鼠标事件变化来进行分屏联动(同一坐标系) (同理可以 ...
- ArcGIS JS 学习笔记1 用ArcGIS JS 实现仿百度地图的距离量测和面积量测
一.开篇 在博客注册了三年,今天才决定写第一篇博客,警告自己不要懒!!! 二.关于ArcGIS JS 版本选择 在写这篇博客时ArcGIS JS 4.0正式版已经发布.它和3.x版本的不同是,Map不 ...
- arcgis js 之 渔网工具(调用地图服务)
arcgis js 之 渔网工具(调用地图服务) 原理: 简历不同级别的网渔网图层,设置显示比例尺.然后发布服务,使用MapImageLayer接收. 过程: 1.在arcmap中用创建渔网工具将不同 ...
随机推荐
- error:Cannot pull with rebase
原文文链接:https://blog.csdn.net/u012385190/article/details/70670213git 执行git pull –rebase报错误如下: error: C ...
- 阶段5 3.微服务项目【学成在线】_day03 CMS页面管理开发_06-新增页面-前端-新增页面
新建一个添加的页面 复制page_list页面改改名字 page_add 一个标准的页面 <template> <div> 新增页面 </div> </tem ...
- matlab学习——01线性规划
01线性规划 format compact; % min fx % Ax<=b % Aeq*x=beq % lb<=x<=ub % % max z=2x1+3x2-5x3 % x1+ ...
- Java操作excel_导出与读取(导入)
我自己的jar包下载 一.介绍 常常有客户这样子要求:你要把我们的报表直接用Excel打开(电信系统.银行系统).或者是:我们已经习惯用Excel打印.这样在我们实际的开发中,很多时候需要实现导入.导 ...
- 【SQL】在数据库中发起http请求的小改进
市面上常见的是用MSXML2.ServerXMLHTTP这个类,但这个类在发起异步请求时并不可靠,就是当send后并不一定会发出这个请求.这里推荐改用Microsoft.XMLHTTP,如果只是简单的 ...
- LAG函数实现环比
,)OVER(ORDER BY 年月) 环比金额 from( 年, 季度, 年月 ,SUM(金额本位币) 金额 FROM ( SELECT * FROM [dbo].[T_output] ) cb_v ...
- mongodb的安装部署-备份
1.安装部署 wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-3.4.10.tgz tar -zxf mongodb-linux- ...
- 使用tensorflow训练SSD(一):相关环境的配置
在使用TensorFlow进行目标检测时,首先需要下载tensorflow object detection API模型,该模型的下载地址为https://github.com/tensorflow/ ...
- IO阻塞模型、IO非阻塞模型、多路复用IO模型
IO操作主要包括两类: 本地IO 网络IO 本地IO:本地IO是指本地的文件读取等操作,本地IO的优化主要是在操作系统中进行,我们对于本地IO的优化作用十分有限 网络IO:网络IO指的是在进行网络操作 ...
- python解析jSON文件
一.jSON文件 http://baike.baidu.com/link?url=wYeeLnhpXX-Tt8AoBRSNPh2P7Z2YHyK2tdD1tbBOQMfJIpA-YNHMOg2ZN6a ...