绑定事件:map.on(type, listener)

取消绑定:map.un(type, listener)

type:事件类型

listener:执行得函数体

事件类型:

//事件类型
let type = {
click:'click',//单击
dblclick:'dblclick',//双击,双击会触发click
singleclick:'singleclick',//单击,延迟250毫秒,就算双击不会触发
moveend:'moveend',//鼠标滚动事件
pointermove:'pointermove',//鼠标移动事件
pointerdrag:'pointerdrag',//鼠标拖动事件
precompose:'precompose',//地图准备渲染,为渲染
postcompose:'postcompose',//地图渲染中
postrender:'postrender',//地图渲染全部结束
changeLayerGroup:'change:layerGroup',//地图图层增删时触发
changeSize:'change:size',//地图窗口发生变化就会触发
changeTarget:'change:target',//地图绑定的div发生更改时触发
changeView:'change:view',//地图view对象发生变化触发
propertychange:'propertychange',//Map对象中任意的property值改变时触发
}

例子:

//绑定事件
let fn = function(e){
console.log(e)
}
map.on(type.click,fn) //取消绑定
setTimeout(()=>{
map.un(type.click,fn)
},3000)

通常结合使用的方法:

map.forEachFeatureAtPixel(pixel, callback)

map.on('click',function(e){
//屏幕坐标
let pixel = this.map.getEventPixel(e.originalEvent);
//检测与视口上的像素相交的要素
map.forEachFeatureAtPixel(pixel,function(feature,layers){
//feature,返回的要素
console.log(feature)
//layers,返回的图层
console.log(layers)
})
})

【03】openlayers 地图事件的更多相关文章

  1. Google地图接口API之地图事件(四)

    演示几个地图事件: 1. 点击标记缩放地图 仍然使用上一遍文章使用的英国伦敦的地图.点用户点击标记时实现缩放地图的功能(点击标记时绑定地图缩放事件). 代码如下: <html> <h ...

  2. 百度地图API的第一次接触——地图事件

    0.初始化地图 var map = new BMap.Map("container"); var point = new BMap.Point(116.404, 39.915); ...

  3. Openlayers 地图定位到相应位置并缩放

    说明: 在地图操作中,有个功能,需要点击一个点,将视图定位到点击点的位置,并放大. 解决方案: 1.可以有openlayers中可以有ol.View来控制,但是在更改时,会将地图初始化时设置的maxZ ...

  4. Android百度地图开发03之地图控制 + 定位

    前两篇关于百度地图的blog写的是,一些基本图层的展示 和 覆盖物的添加+地理编码和反地理编码. 接下来,这篇blog主要说一些关于地图控制方面的内容和定位功能. 百度地图提供的关于地图的操作主要有: ...

  5. ArcGIS Runtime for Android开发教程V2.0(8)基础篇-----地图事件

    转自:http://blog.csdn.net/arcgis_mobile/article/details/8263283 ArcGIS Runtime sdk for Android为我们提供了丰富 ...

  6. 【04】openlayers 地图弹框

    效果: 创建地图: //创建地图 var map = new ol.Map({ //设置显示地图的视图 view: new ol.View({ projection: 'EPSG:4326', //投 ...

  7. 【11】openlayers 地图交互

    地图交互interaction 关于map的方法: //添加地图交互 map.addInteraction(interaction) //删除地图交互 map.removeInteraction(in ...

  8. 【iScroll源码学习03】iScroll事件机制与滚动条的实现

    前言 想不到又到周末了,周末的时间要抓紧学习才行,前几天我们学习了iScroll几点基础知识: 1. [iScroll源码学习02]分解iScroll三个核心事件点 2. [iScroll源码学习01 ...

  9. openlayers 注册事件例子

    registerEvents:function() { this.events = new OpenLayers.Events(this, this.div, null, true); functio ...

随机推荐

  1. [LC] 106. Construct Binary Tree from Inorder and Postorder Traversal

    Given inorder and postorder traversal of a tree, construct the binary tree. Note:You may assume that ...

  2. 学习python-20191203-Python Flask高级编程开发鱼书_第02章 Flask的基本原理与核心知识

    视频01: 做一个产品时,一定要对自己的产品有一个明确的定位.并可以用一句话来概括自己产品的核心价值或功能. 鱼书网站几个功能 1.选择要赠送的书籍,向他人赠送书籍(价值功能,核心价值的主线): 2. ...

  3. Critical-Value|Critical-Value Approach to Hypothesis Testing

    9.2 Critical-Value Approach to Hypothesis Testing example: 对于mean 值 275 的假设: 有一个关于sample mean的distri ...

  4. 堆优DIJ模板

    Dij:贪心思想的单源最短路,时间复杂度O(n^2). Dij算法流程: d数组记录源点s到每个点的距离,若无边则设为inf,标记源点: 选出d数组中未标记的最小值,该节点记为k,并标记k为已求出最短 ...

  5. perf4j+spring+aop 配置 注解方式

    今天将perf4j基于spring aop方式进入了接入,接入方法还是比较简单.具体配置如下: logback.xml <!--perf4j配置--> <appender name= ...

  6. Halcon算子函数

    Chapter_1_:Classification 1.1  Gaussian-Mixture-Models 1.add_sample_class_gmm 功能:把一個訓練樣本添加到一個高斯混合模型的 ...

  7. python3多进程爬虫(第二卷)

    上卷中讲到,我有4个进程,可是我要同时爬取20+数据怎么办,很明显上卷的语法公式不可以,所以现在我引入线程池 现在看一下线程池的语法 看一下爬虫: 注意圈中重点

  8. python djangjo完整的实现添加的实例

    实现:点击添加实现模态对话框,添加数据并显示. urls.py from django.conf.urls import url from django.contrib import admin fr ...

  9. PHP导出excel文件的多种方式

    1.第一种实现的方法 set_time_limit(0); //逐条导出数据 ob_end_clean(); header("Content-type: application/vnd.ms ...

  10. mybatis 添加后获得该新增数据自动生成的 id

    // useGeneratedKeys默认值为false,keyProperty的值对应的是User类中的主键字段名 // mybatis 写法如下 <insert id="inser ...