网站开发 无形资产,在线注销营业执照,房地产最新消息政策,网页设计作品下载文章目录 interaction 是什么interaction 简介interaction defaults- 默认添加的功能举例结论 interaction 是什么
地图的交互功能包含很多#xff0c;如地图双击放大#xff0c;鼠标滚轮缩放#xff0c;矢量要素点选#xff0c;地图上绘制图形等等。只要是涉及到与地图的… 文章目录 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-拖动旋转 布尔值默认为truedoubleClickZoom 是否鼠标或手指双击缩放地图布尔值默认为truekeyboard 是否需要键盘交互布尔值默认为truemouseWheelZoom 是否鼠标滚轮缩放地图。布尔值 默认为trueshiftDragZoom 是否需要Shift拖动缩放布尔值默认为true 。dragPan 是否鼠标或手指拖拽平移地图布尔值默认为truepinchRotate 是否两个手指旋转地图针对触摸屏布尔值默认为truepinchZoom 是否两个手指旋转地图针对触摸屏布尔值默认为truezoomDelta 使用键盘或双击缩放时的缩放级别增量。数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 绘制选择要素 select modify 铺捉吸附的 snap 和鼠标自定义事件 pointer 都构成了openlayers 更加强大的交互功能系统提升更优的用户体验。
