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之地图分屏同步的更多相关文章

  1. arcgis api for js入门开发系列六地图分屏对比(含源代码)

    上一篇实现了demo的地图标绘模块,本篇新增地图地图分屏对比模块,截图如下(源代码见文章底部): 对效果图的简单介绍一下,在demo只采用了两分屏对比,感兴趣的话,可以在两分屏的基础上拓展,修改css ...

  2. arcgis api 3.x for js 入门开发系列六地图分屏对比(附源码下载)

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  3. ArcGIS Pro开发Web3D应用(2)——地图分屏对比(多屏对比)思路

    很多应用中都需要用到地图联动.多屏对比.二三维分屏.大屏显示,有图形可视化的地方就有事件响应触发:鼠标按下.移动.鼠标滚轮,由此触发了地图上坐标或范围的变化,将这些变化发送给另一个地图并响应这些变化, ...

  4. leaflet-webpack 入门开发系列三地图分屏对比(附源码下载)

    前言 leaflet-webpack 入门开发系列环境知识点了解: node 安装包下载webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载地址 w ...

  5. arcgis api for js回调函数如何等待同步

    arcgis js开发往往会遇到同步异步的问题,有可能在上一步使用了arcgis js模块回调函数,下一步需要用上一步回调函数的结果,但是因为JavaScript是异步执行的,它并不会等待上一步的回调 ...

  6. 基于jquery的页面分屏切换模板

    闲来无事,搞了个页面的分屏效果,先来看下效果: 出于可自定义宽高的目的,屏幕分块由CSS控制,由js控制估计等分模块效果一般. 程序相关说明: HTML结构: <div class=" ...

  7. Arcgis API for JS——普通分屏联动及二三维联动

    对于二三维联动,有多种方法进行实现,当时旧项目使用了当时能掌握的一种写法,在技能提升了这么多后当然要对这些写法做一个总结. 一.通过监听View上的鼠标事件变化来进行分屏联动(同一坐标系) (同理可以 ...

  8. ArcGIS JS 学习笔记1 用ArcGIS JS 实现仿百度地图的距离量测和面积量测

    一.开篇 在博客注册了三年,今天才决定写第一篇博客,警告自己不要懒!!! 二.关于ArcGIS JS 版本选择 在写这篇博客时ArcGIS JS 4.0正式版已经发布.它和3.x版本的不同是,Map不 ...

  9. arcgis js 之 渔网工具(调用地图服务)

    arcgis js 之 渔网工具(调用地图服务) 原理: 简历不同级别的网渔网图层,设置显示比例尺.然后发布服务,使用MapImageLayer接收. 过程: 1.在arcmap中用创建渔网工具将不同 ...

随机推荐

  1. error:Cannot pull with rebase

    原文文链接:https://blog.csdn.net/u012385190/article/details/70670213git 执行git pull –rebase报错误如下: error: C ...

  2. 阶段5 3.微服务项目【学成在线】_day03 CMS页面管理开发_06-新增页面-前端-新增页面

    新建一个添加的页面 复制page_list页面改改名字 page_add 一个标准的页面 <template> <div> 新增页面 </div> </tem ...

  3. matlab学习——01线性规划

    01线性规划 format compact; % min fx % Ax<=b % Aeq*x=beq % lb<=x<=ub % % max z=2x1+3x2-5x3 % x1+ ...

  4. Java操作excel_导出与读取(导入)

    我自己的jar包下载 一.介绍 常常有客户这样子要求:你要把我们的报表直接用Excel打开(电信系统.银行系统).或者是:我们已经习惯用Excel打印.这样在我们实际的开发中,很多时候需要实现导入.导 ...

  5. 【SQL】在数据库中发起http请求的小改进

    市面上常见的是用MSXML2.ServerXMLHTTP这个类,但这个类在发起异步请求时并不可靠,就是当send后并不一定会发出这个请求.这里推荐改用Microsoft.XMLHTTP,如果只是简单的 ...

  6. LAG函数实现环比

    ,)OVER(ORDER BY 年月) 环比金额 from( 年, 季度, 年月 ,SUM(金额本位币) 金额 FROM ( SELECT * FROM [dbo].[T_output] ) cb_v ...

  7. mongodb的安装部署-备份

    1.安装部署 wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-3.4.10.tgz tar -zxf mongodb-linux- ...

  8. 使用tensorflow训练SSD(一):相关环境的配置

    在使用TensorFlow进行目标检测时,首先需要下载tensorflow object detection API模型,该模型的下载地址为https://github.com/tensorflow/ ...

  9. IO阻塞模型、IO非阻塞模型、多路复用IO模型

    IO操作主要包括两类: 本地IO 网络IO 本地IO:本地IO是指本地的文件读取等操作,本地IO的优化主要是在操作系统中进行,我们对于本地IO的优化作用十分有限 网络IO:网络IO指的是在进行网络操作 ...

  10. python解析jSON文件

    一.jSON文件 http://baike.baidu.com/link?url=wYeeLnhpXX-Tt8AoBRSNPh2P7Z2YHyK2tdD1tbBOQMfJIpA-YNHMOg2ZN6a ...