GIS前端-地图事件编程

news/2024/12/19 1:54:49/

GIS前端-地图事件编程

    • 图层操作事件
    • 地图状态事件
    • 交互事件
    • 弹出框事件
    • 导出PDF

在地图上的一切操作均要采用地图事件机制来实现,即通过鼠标、键盘等交互,触发地图相关事件,进而调用相关功能接口函数实现相应的GIS功能。在具体的实现过程中,我们需要对地图的操作行为进行事件监听,有关Map对象的事件监听方法如表
在这里插入图片描述
有关Map对象的事件注册及注销代码如下:
在这里插入图片描述
上述代码介绍了给Map对象添加事件、移除事件、激发事件的方法。如果读者感兴趣,则可以参考Leaflet官网(https://leafletjs.com)查看更详细的内容。其实,所有事件调用的方法都是相似的,复杂的事件可以被看成多个简单事件的组合。Leaflet的地图事件主要有以下几类:图层操作事件、地图状态事件、交互事件和弹出框事件

图层操作事件

图层操作事件,即对地图容器中的图层进行操作的事件。Leaflet开发库中包含的图层操作事件及其说明
在这里插入图片描述
在这里插入图片描述

地图状态事件

地图状态事件,即地图状态改变时触发的一系列事件。Leaflet开发库中包含的地图状态事件及其说明如
在这里插入图片描述
地图移动结束事件代码如下:
在这里插入图片描述

交互事件

交互事件包括鼠标事件和键盘事件,即通过鼠标或键盘触发的事件。Leaflet开发库中的鼠标事件和键盘事件及其说明在这里插入图片描述

弹出框事件

弹出框事件,即某种行为触发的弹出框行为事件,常见的弹出框事件及其说明
在这里插入图片描述

弹出框弹出事件与关闭事件代码如下:
在这里插入图片描述
对Leaflet的地图控件、地图操作和地图事件有了一定程度的了解,结合丰富的实例读者也会掌握各个基础功能的具体实现方法。基础功能对一个WebGIS应用来说至关重要,它能让一张静态的地图动起来,让地图承载更多的空间信息,并以友好的交互方式呈现给用户。

导出PDF

,即把地图中所显示的内容以PDF格式导出到本地。下面以Leaflet插件资源库中的leaflet.browser.print插件为例,创建L.control.browserPrint类对象,通过printModes设置PDF导出模式,将导出控件添加至地图中,主要实现步骤如下。
(1)新建一个HTML页面,参照2.4.2节加载一幅天地图地图作为底图。
(2)在区域中添加导出PDF功能所需的leaflet.browser.print.min.js脚本库,该脚本库下载地址为https://github.com/Igor-Vladyka/leaflet.browser.print。
(3)在加载地图的init()函数中,初始化插件库中的导出PDF控件L.controlbrowserPrint,并将其添加到地图容器中。
代码如下:
在这里插入图片描述
卷帘
卷帘,即地图的遮罩效果,用户可以通过一个滑动按钮来控制图层之间的DOM样式,进而动态改变地图显示的范围。下面以Leaflet插件资源库中的Leaflet.Control.SideBySide插件为例(下载地址为https://github.com/digidem/leaflet-side-by-side),分别加载显示天地图矢量图层和天地图影像图层,通过插件封装的L.Control.SideBySide类创建卷帘控件并添加至地图中,从而实现卷帘效果,如
在这里插入图片描述


http://www.ppmy.cn/news/1109490.html

相关文章

探索装饰艺术的未来,留存传统的精髓

近一个世纪后,装饰艺术终于卷土重来。正如我们在全球新的项目、室内空间和家具中所看到的,那种令我们渴望20世纪初20年代繁荣时期的奢华和魅力。作为装饰艺术建筑和设计的独特身份一直在世界上继续启发着人们,那么从新的设计和现有设计的保留…

本地缓存 guava

缓存接口 集成guava本地缓存

十六、Webpack常见的插件和模式

一、认识插件Plugin Webpack的另一个核心是Plugin,官方有这样一段对Plugin的描述: While loaders are used to transform certain types of modules, plugins can be leveraged to perform a wider range of tasks like bundle optimization, asset m…

Caffe在Linux下的安装,编译,实验

第一部分:Caffe 简介 caffe是有伯克利视觉和学习中心(BVLC)开发。作者是伯克利博士贾杨清。 caffe是一个深度学习(deep learning)框架。其具有易读、快速和模块化思想。 第二部分:Caffe安装与配置 2.1 配置环境:ub…

驱动开发--字符设备驱动的实现

一、字符设备驱动内部注册过程 通过对register_chrdev内部的实现过程进行分析,其实注册字符设备驱动的过程就是下面几步: 1.分配struct cdev对象空间 2.初始化struct cdev对象 3.注册cdev对象 完成上面的三步,就完成了字符设备驱动的注册…

前台线程与后台线程

一、认识前台线程与后台线程 1、什么是前台线程? 前台线程(Foreground Thread)是指在程序运行过程中,与用户交互的线程。 它主要负责处理用户界面的更新、用户输入的响应等任务。前台线程的生命周期与应用程序的生…

快速搭建超轻量级图床——Cpolar+和树洞外链

文章目录 1.前言2. 树洞外链网站搭建2.1. 树洞外链下载和安装2.2 树洞外链网页测试2.3 cpolar的安装和注册 3.本地网页发布3.1 Cpolar临时数据隧道3.2 Cpolar稳定隧道(云端设置)3.3 Cpolar稳定隧道(本地设置) 4.公网访问测试5.结语…

Layui快速入门之第七节 表格

目录 一:基本用法 基本案例: 二:静态表格 三:模板配置渲染 四:静态表格转换 五:已知数据渲染 六:自定义模板 API 渲染 一:基本用法 表格组件 table 是 Layui 中使用率极高的…