WebGIS开发0基础必看教程:鹰眼的实现思路

1.背景

鹰眼功能是WebGIS中的一种常见功能,利用一些开源的框架实现起来非常方便。当然,按照博主从底层谈WebGIS这套系列的风格,在这里还是跟大家一起探讨探讨不借助第三方框架开发鹰眼的简单实现思路。

2.鹰眼功能分析

img

3.实现思路设计

3.1主图平移时与鹰眼图的联动

a.主图进行平移时,在平移完成后抛出地图平移事件,该事件中包含真实平移地理长度(GeoPanX,GeoPanY)参数。

b.鹰眼图监听到该平移事件,获取到平移地理长度后,换算出此时对应鹰眼地图的平移屏幕坐标(screenPanX,screenPanY),与鹰眼地图canvas的XY坐标进行相加,实现鹰眼地图的联动。

c.鹰眼地图平移超出缓存瓦片范围时,需要重新获取瓦片。

3.2主图缩放时鹰眼图范围重绘

a.主图缩放时会抛出地图缩放事件,该事件中会包含此时主图屏幕范围对应的真实地理范围参数(GeoScreenLeft,GeoScreenTop,GeoScreenRight,GeoScreenBottom)以及此时的地图级别(maplevel)。

b.鹰眼图监听该缩放事件,获取到此时主图的真实地理范围,以及主图地图级别。

c.判断此时主图级别是否满足绘制主图返回的参数设置,如果满足,则在鹰眼中绘制此时的主图范围。

d.将此时的主图地理范围坐标转换为鹰眼上的屏幕坐标,在鹰眼上进行绘制。

3.3鹰眼范围框拖拽是主图联动

a.鹰眼的范围框监听鼠标事件,响应拖拽操作。

b.范围框拖拽完毕后,会将拖拽的真实地理长度(eagleGeoPanX,eagleGeoPanY)以参数的形式随同鹰眼平移事件一起被触发。

c.主图监听鹰眼平移事件,获取到鹰眼真实平移地理长度后进行换算成与主图对应的屏幕平移坐标,对主图进行平移。

d.主图平移后,再次触发主图平移事件,如3.1中流程所描述,最后鹰眼也会进行平移联动。

3.4注意事项

a.鹰眼上地图不能相应鼠标事件(缩放、平移)。

b.鹰眼上的范围框颜色应该可以定制。

4.成果展示

img

点击免费领取更多webgis开发学习资料

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/741052.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++内存对齐知识点总结

什么是内存对齐 理论上:32位系统:int 4字节,char1字节 现代计算机内存空间都是按照字节划分的。理论上计算机系统对基本类型数据在内存的变量的访问可以从任何地址开始,但是时机的计算机系统对基本类型的数据在内存中存放的位置是…

C语言 - 堆栈二叉树的基础及应用

1.历史 堆栈是为了减少程序内存占用的问题而发明的 机器上电后,所有的变量都需要copy到内存中运行,但是机器的内存大小一直都是比较有限的,所以堆栈和局部变量两个概念被提出来 2.栈 每次手动创建、删除变量非常麻烦,于是…

OpenCV-图像基础处理

目录 1 彩色(RGB)图像 2 灰度图像 3 黑白图像 1 彩色(RGB)图像 使用cv2.imread()函数加载RGB图像;使用cv2.split()函数分割颜色通道;将BGR颜色格式转换成RGB颜色格式;使用matplotlib或cv2.i…

【spring】@Bean注解学习

Bean介绍 Bean用于指示一个方法应该产生一个Bean对象,并将其交给Spring容器管理。 当使用Bean注解的方法被Spring容器调用时,它只会执行一次,随后该方法返回的Bean对象会被添加到Spring的IOC(Inversion of Control,控…

【C#】【SAP2000】读取SAP2000中单元截面信息和几何信息到Grasshopper中

if (build true){// 声明变量int ret;int Numit 0;int[] ObjType new int[0];string[] ObjName new string[0];string sauto "";string propname "";string point1 "";string point2 "";double x1 0;double y1 0;double z1 …

静电ESD整改:原因、影响与解决方案详解?|深圳比创达电子

静电(ESD)是在日常生活和工作中常见的现象,但它可能对电子设备和器件造成严重的损坏。本文将介绍静电ESD的定义、原因、影响以及解决方案,帮助大家更好地了解ESD问题,并采取相应的整改措施。 一、静电ESD的定义 静电…

计算机网络 应用层的考纲内容 网络应用模型 域名系统

包括, 1,网络应用模型,包括:客户/服务器模型;P2P模型。 2,域名系统DNS,层次域名空间,域名服务器,域名解析过程。 3,文件传输协议,FTP&#xff…

基础的正则表达式

正则表达式(Regular Expression,简称正则或RegExp)是用于匹配字符串中字符组合的表达式。它是一种强大的工具,可以用于搜索、替换和提取字符串中的文本。 正则表达式由字符和操作符构成,用于描述字符串模式。以下是一些…

LeetCode1.两数之和

LeetCode第一题,两数之和 因为是第一题所以热度比较高,有很多种解法 给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 target 的那 两个 整数,并返回它们的数组下标。 你可以假设每种输入只会对应…

L2-4 寻宝图(Python3)

给定一幅地图,其中有水域,有陆地。被水域完全环绕的陆地是岛屿。有些岛屿上埋藏有宝藏,这些有宝藏的点也被标记出来了。本题就请你统计一下,给定的地图上一共有多少岛屿,其中有多少是有宝藏的岛屿。 输入格式&#xf…

Python Excel 文本编辑库之xlsxwriter使用详解

概要 在现代数据处理和报表生成中,Excel 文件是一个非常常见的格式。Python XlsxWriter 库是一个强大的工具,可以帮助开发者轻松创建和编辑 Excel 文件,并且具有高度的灵活性和可定制性。本文将全面介绍 XlsxWriter 库的原理、功能、用法,并通过丰富的示例代码来展示其强大…

什么是工业数采网关?如何远程数采?

随着工业自动化的不断发展,数据采集与远程控制成为了生产过程中不可或缺的一环。而工业数采网关,作为连接工业设备与上位管理系统之间的桥梁,扮演着越来越重要的角色。HiWoo Box 作为一款优秀的工业数采网关产品,为 PLC、传感器、…

AI大语言模型GPT R 生态环境领域数据统计分析

自2022年GPT(Generative Pre-trained Transformer)大语言模型的发布以来,它以其卓越的自然语言处理能力和广泛的应用潜力,在学术界和工业界掀起了一场革命。在短短一年多的时间里,GPT已经在多个领域展现出其独特的价值…

小脑萎缩患者的饮食秘籍,让生活更加精彩!

在面对小脑萎缩这一挑战时,正确的饮食习惯能够为患者带来巨大的改变。今天,让我们一起探索如何通过饮食的力量,帮助小脑萎缩患者改善生活质量,让每一天都充满希望和活力! 小脑萎缩患者的饮食应以均衡为原则&#xff0…

软raid sync_action

控制节点: /sys/block/md127/md/sync_action内核是怎么实现的,为什么mdadm管理命令仅支持四种? [rootgitclient ~]# mdadm --action --help mdadm: action must be one of idle, frozen, check, repair内核文档是怎么描述这个节点&#xff…

比特币如何运作?区块链、网络、交易

文章目录 一、比特币基础知识1.1 什么是比特币?1.2 比特币关键术语解释 二、区块链:比特币的支柱2.1 区块链如何运作2.2 什么是哈希?2.3 采矿的作用2.4 为什么区块链如此重要 三、密码学简介3.1 什么是密码学?3.2 密码学在比特币运…

2024年第十五届蓝桥杯第三期(校内)模拟赛题解

第一题 6 【问题描述】 请问 2023 有多少个约数?即有多少个正整数,使得 2023 是这个正整数的整数倍。 【答案提交】 这是一道结果填空的题,你只需要算出结果后提交即可。本题的结果为一个整数,在提交答案时只填写这个整数&#…

蓝牙系列十五:协议栈GAP层分析

Generic Access Profile(通用访问规范) 它在用来控制设备连接和广播,用于提供蓝牙设备的通用访问功能,包括设备发现、连接、鉴权、服务发现等等。 GATT是建立连接后通信规范, 而蓝牙是通过GAP建立通信的。 GAP 使你的…

边缘智能融合区块链:研究现状、应用及挑战

源自:信息与控制 作者:任晓旭 仇超 邓辉 戴子明 刘泽军 王晓飞 “人工智能技术与咨询” 发布 摘 要 边缘智能集网络、计算、存储和智能于一体,将智能推向网络边缘,为互联时代的低延迟关键计算开辟了道路。为进一步满足…

算法学习系列(四十):贡献法

目录 引言概念一、孤独的照片二、牛的基因学三、字串分值 引言 关于这个贡献法考的不是很多,主要题型是出现在需要枚举每一个组合这类题,出现的次数较多。没有固定的模板,就是一种思想,跟贪心一样,每个题都是不一样的…