openlayers [六] 地图交互 interaction 详解

2024-01-19 14:44

本文主要是介绍openlayers [六] 地图交互 interaction 详解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

文章目录

    • interaction 是什么
    • interaction 简介
    • interaction defaults- 默认添加的功能
    • 举例
    • 结论

interaction 是什么

地图的交互功能包含很多,如地图双击放大,鼠标滚轮缩放,矢量要素点选,地图上绘制图形等等。只要是涉及到与地图的交互,就会涉及到 intercation 类,它定义了用户与地图进行交互的基本要素和事件。

interaction 简介

在 OpenLayers 6 中,表达交互功能的基类是 interaction,它是一个虚基类,不负责实例化,交互功能都继承该基类, OpenLayers 6 中可实例化的子类及其功能如下:

  • doubleclickzoom ,双击放大交互功能;
  • draganddrop ,以“拖文件到地图中”的交互添加图层;
  • dragbox,拉框,用于划定一个矩形范围,常用于放大地图;
  • dragpan ,拖拽平移地图;
  • dragrotateandzoom,拖拽方式进行缩放和旋转地图;
  • dragrotate ,拖拽方式旋转地图;
  • dragzoom ,拖拽方式缩放地图;
  • draw,绘制地理要素功能;
  • keyboardpan ,键盘方式平移地图;
  • keyboardzoom ,键盘方式缩放地图;
  • select,选择要素功能;
  • modify ,更改要素;
  • mousewheelzoom ,鼠标滚轮缩放功能;
  • pinchrotate,手指旋转地图,针对触摸屏;
  • pinchzoom ,手指进行缩放,针对触摸屏;
  • pointer ,鼠标的用户自定义事件基类;
  • snap,鼠标捕捉,当鼠标距离某个要素一定距离之内,自动吸附到要素。
  • interaction defaults ,规定了默认添加的交互功能;

interaction defaults- 默认添加的功能

该类规定了默认包含在地图中的功能,他们都是继承自 ol.interaction 类。 主要是最为常用的功能,如缩放、平移和旋转地图等,具体功能有如下这些:

  • altShiftDragRotate 是否需要Alt-Shift-拖动旋转 (布尔值:默认为true)
  • doubleClickZoom 是否鼠标或手指双击缩放地图(布尔值:默认为true)
  • keyboard 是否需要键盘交互(布尔值:默认为true)
  • mouseWheelZoom 是否鼠标滚轮缩放地图。布尔值 (默认为true)
  • shiftDragZoom 是否需要Shift拖动缩放(布尔值:默认为true) 。
  • dragPan 是否鼠标或手指拖拽平移地图(布尔值:默认为true)
  • pinchRotate 是否两个手指旋转地图,针对触摸屏(布尔值:默认为true)
  • pinchZoom 是否两个手指旋转地图,针对触摸屏(布尔值:默认为true)
  • zoomDelta 使用键盘或双击缩放时的缩放级别增量。(数)
  • zoomDuration 缩放动画的持续时间(数:以毫秒为单位)
  • onFocusOnly 仅在地图具有焦点时进行交互。这会影响MouseWheelZoom和的DragPan相互作用,并且在没有浏览器焦点的地图需要页面滚动时很有用(布尔值:默认为false)

举例

dragrotateandzoom (shift + 鼠标拖拽进行缩放和旋转地图)

import {defaults as defaultInteractions,DragRotateAndZoom
} from "ol/interaction";map.value = new Map({target: target,layers: tileLayer,view: view,interactions: defaultInteractions().extend([new DragRotateAndZoom()])
});

结论

地图交互功能内容实在是太多了,包括 键盘事件,鼠标事件,拖拽,平移,缩放 等一些基本的交互动作,还有后面会写到的 测距,测面,通过draw 绘制,选择要素 selectmodify ,铺捉吸附的 snap 和鼠标自定义事件 pointer 都构成了openlayers 更加强大的交互功能系统,提升更优的用户体验。

这篇关于openlayers [六] 地图交互 interaction 详解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/622757

相关文章

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明(认真看哦) AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证,则会调用 #attemptAuthentica

无人叉车3d激光slam多房间建图定位异常处理方案-墙体画线地图切分方案

墙体画线地图切分方案 针对问题:墙体两侧特征混淆误匹配,导致建图和定位偏差,表现为过门跳变、外月台走歪等 ·解决思路:预期的根治方案IGICP需要较长时间完成上线,先使用切分地图的工程化方案,即墙体两侧切分为不同地图,在某一侧只使用该侧地图进行定位 方案思路 切分原理:切分地图基于关键帧位置,而非点云。 理论基础:光照是直线的,一帧点云必定只能照射到墙的一侧,无法同时照到两侧实践考虑:关

OpenHarmony鸿蒙开发( Beta5.0)无感配网详解

1、简介 无感配网是指在设备联网过程中无需输入热点相关账号信息,即可快速实现设备配网,是一种兼顾高效性、可靠性和安全性的配网方式。 2、配网原理 2.1 通信原理 手机和智能设备之间的信息传递,利用特有的NAN协议实现。利用手机和智能设备之间的WiFi 感知订阅、发布能力,实现了数字管家应用和设备之间的发现。在完成设备间的认证和响应后,即可发送相关配网数据。同时还支持与常规Sof

6.1.数据结构-c/c++堆详解下篇(堆排序,TopK问题)

上篇:6.1.数据结构-c/c++模拟实现堆上篇(向下,上调整算法,建堆,增删数据)-CSDN博客 本章重点 1.使用堆来完成堆排序 2.使用堆解决TopK问题 目录 一.堆排序 1.1 思路 1.2 代码 1.3 简单测试 二.TopK问题 2.1 思路(求最小): 2.2 C语言代码(手写堆) 2.3 C++代码(使用优先级队列 priority_queue)

K8S(Kubernetes)开源的容器编排平台安装步骤详解

K8S(Kubernetes)是一个开源的容器编排平台,用于自动化部署、扩展和管理容器化应用程序。以下是K8S容器编排平台的安装步骤、使用方式及特点的概述: 安装步骤: 安装Docker:K8S需要基于Docker来运行容器化应用程序。首先要在所有节点上安装Docker引擎。 安装Kubernetes Master:在集群中选择一台主机作为Master节点,安装K8S的控制平面组件,如AP

嵌入式Openharmony系统构建与启动详解

大家好,今天主要给大家分享一下,如何构建Openharmony子系统以及系统的启动过程分解。 第一:OpenHarmony系统构建      首先熟悉一下,构建系统是一种自动化处理工具的集合,通过将源代码文件进行一系列处理,最终生成和用户可以使用的目标文件。这里的目标文件包括静态链接库文件、动态链接库文件、可执行文件、脚本文件、配置文件等。      我们在编写hellowor

LabVIEW FIFO详解

在LabVIEW的FPGA开发中,FIFO(先入先出队列)是常用的数据传输机制。通过配置FIFO的属性,工程师可以在FPGA和主机之间,或不同FPGA VIs之间进行高效的数据传输。根据具体需求,FIFO有多种类型与实现方式,包括目标范围内FIFO(Target-Scoped)、DMA FIFO以及点对点流(Peer-to-Peer)。 FIFO类型 **目标范围FIFO(Target-Sc

019、JOptionPane类的常用静态方法详解

目录 JOptionPane类的常用静态方法详解 1. showInputDialog()方法 1.1基本用法 1.2带有默认值的输入框 1.3带有选项的输入对话框 1.4自定义图标的输入对话框 2. showConfirmDialog()方法 2.1基本用法 2.2自定义按钮和图标 2.3带有自定义组件的确认对话框 3. showMessageDialog()方法 3.1

脏页的标记方式详解

脏页的标记方式 一、引言 在数据库系统中,脏页是指那些被修改过但还未写入磁盘的数据页。为了有效地管理这些脏页并确保数据的一致性,数据库需要对脏页进行标记。了解脏页的标记方式对于理解数据库的内部工作机制和优化性能至关重要。 二、脏页产生的过程 当数据库中的数据被修改时,这些修改首先会在内存中的缓冲池(Buffer Pool)中进行。例如,执行一条 UPDATE 语句修改了某一行数据,对应的缓

uniapp设置微信小程序的交互反馈

链接:uni.showToast(OBJECT) | uni-app官网 (dcloud.net.cn) 设置操作成功的弹窗: title是我们弹窗提示的文字 showToast是我们在加载的时候进入就会弹出的提示。 2.设置失败的提示窗口和标签 icon:'error'是设置我们失败的logo 设置的文字上限是7个文字,如果需要设置的提示文字过长就需要设置icon并给