OL3-Cesium 二三维鼠标事件统一处理
like the github issue:
https://github.com/openlayers/ol3-cesium/issues/344#issuecomment-214098148
thanks jmgomezpoveda .
i find the way to deal with it.
key point is: brower events and pixel happened.
sucess click and move event.
code:
//二维三维的地图点击事件
// https://github.com/openlayers/ol3/blob/v3.19.0/src/ol/events/eventtype.js
define(['watermap'],function(watermap) {
var clickHandler; var layerNameFliter;
/**
* initMapEvents - 初始化地图事件 鼠标移动以及鼠标单击事件
*
*
* @return {type} Description
*/
var initMapEvents = function() { $('#' + watermap.config.target).on('mousemove touchmove', function(browserEvent) {
var pixel = watermap.map.getEventPixel(browserEvent.originalEvent);
HandleFeaturesAtPixelForMove(pixel);
});
$('#' + watermap.config.target).on('click touchstart', function(browserEvent) {
var pixel = watermap.map.getEventPixel(browserEvent.originalEvent);
var features = getFeaturesAtPixelForClick(pixel);
if (watermap.MapEvent.clickHandler) {
watermap.MapEvent.clickHandler(features);
}
});
};
/**
* setLayerFliters - 设置点击以及鼠标滑过去的图层过滤
*
* @param {type} layerNameArray Description
*
* @return {type} Description
*/
var setLayerFliters = function(layerNameArray) {
this.layerNameFliter = layerNameArray;
};
var addClickHandle = function(handler) {
if (handler && typeof(handler) == 'function') {
this.clickHandler = handler;
} else {
console.log("click handler you add is not a function");
}
};
/**
* HandleFeaturesAtPixelForMove - 依据pixel 获取对应的ol.features - Description
*
* @param {type} pixel Description
*
* @return {type} Description
*/
var HandleFeaturesAtPixelForMove = function(pixel) {
var features = [];
if (watermap.ol3d && watermap.ol3d.getEnabled()) {
var pickedObject = watermap.ol3d.getCesiumScene().pick(new Cesium.Cartesian2(pixel[0], pixel[1]));
watermap.ol3d.canvas_.style.cursor = 'auto';
if (typeof pickedObject !== "undefined") {
// features.push(pickedObject.primitive.olFeature);
watermap.ol3d.canvas_.style.cursor = 'pointer';
}
} else {
watermap.map.getViewport().style.cursor = 'auto';
watermap.map.forEachFeatureAtPixel(pixel, function(feature) {
watermap.map.getViewport().style.cursor = 'pointer';
},
undefined,
function(layer) { //标注图层过滤
var layerName = layer.get('name');
if (watermap.MapEvent.layerNameFliter && watermap.MapEvent.layerNameFliter.indexOf(layerName)>=0) {
return true;
}
return false;
});
}
return features;
};
/**
* getFeaturesAtPixelForClick - 依据pixel 获取对应的ol.features - Description
*
* @param {type} pixel Description
*
* @return {type} Description
*/
var getFeaturesAtPixelForClick = function(pixel) {
var features = [];
if (watermap.ol3d && watermap.ol3d.getEnabled()) {
var pickedObject = watermap.ol3d.getCesiumScene().pick(new Cesium.Cartesian2(pixel[0], pixel[1]));
if (typeof pickedObject !== "undefined") {
features.push(pickedObject.primitive.olFeature);
}
} else {
watermap.map.forEachFeatureAtPixel(pixel, function(feature) {
var featureShow;
features.push(feature);
},
undefined,
function(layer) { //标注图层过滤
var layerName = layer.get('name');
if (watermap.MapEvent.layerNameFliter && watermap.MapEvent.layerNameFliter.indexOf(layerName)>=0) {
return true;
}
return false;
});
}
return features;
}; return {
initMapEvents:initMapEvents,
clickHandler: clickHandler,
layerNameFliter: layerNameFliter,
setLayerFliters:setLayerFliters,
addClickHandle: addClickHandle,
};
});
OL3-Cesium 二三维鼠标事件统一处理的更多相关文章
- Redis总结(五)缓存雪崩和缓存穿透等问题 Web API系列(三)统一异常处理 C#总结(一)AutoResetEvent的使用介绍(用AutoResetEvent实现同步) C#总结(二)事件Event 介绍总结 C#总结(三)DataGridView增加全选列 Web API系列(二)接口安全和参数校验 RabbitMQ学习系列(六): RabbitMQ 高可用集群
Redis总结(五)缓存雪崩和缓存穿透等问题 前面讲过一些redis 缓存的使用和数据持久化.感兴趣的朋友可以看看之前的文章,http://www.cnblogs.com/zhangweizhon ...
- Javascript事件模型系列(二)事件的捕获-冒泡机制及事件委托机制
一.事件的捕获与冒泡 由W3C规定的DOM2标准中,一次事件的完整过程包括三步:捕获→执行目标元素的监听函数→冒泡,在捕获和冒泡阶段,会依次检查途径的每个节点,如果该节点注册了相应的监听函数,则执行监 ...
- javaScript事件(二)事件处理程序
一.事件 二.事件流 以上内容见:javaScript事件(一)事件流 三.事件处理程序 前面提到,事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都是事件的名字.响应 ...
- C#总结(二)事件Event 介绍总结
最近在总结一些基础的东西,主要是学起来很难懂,但是在日常又有可能会经常用到的东西.前面介绍了 C# 的 AutoResetEvent的使用介绍, 这次介绍事件(event). 事件(event),对于 ...
- cesium清除选定事件
cesium清除选定事件 此处的案例不一定适合你的项目,但可以给你一个思路.清除选定,就是还原你选中之前的状态.比如你点击一个面高亮,面的颜色发生改变:并且会弹出一个divPoint框.此时的清除选定 ...
- C#特性知识图谱-二、事件
C#特性知识图谱-二.事件 二.事件 在事件驱动的软件系统中,符合某种预设条件的情形出现是,一个事件就会被触发. 2.1 事件三要素 事件源:激发事件的对象 事件信息:事件本身说携带的信息 事件响应者 ...
- 深入理解JS异步编程二(分布式事件)
PubSub模式 从原生的js角度,我们要监听某事件的方法就是利用addEventListener方法,但是当我们的页面趋于复杂,比如要向某个元素添加多个处理事件,那么就要用一个封装函数汇集多个处理函 ...
- Nodejs学习笔记(二)—事件模块
一.简介及资料 http://nodejs.org/api/events.html http://www.infoq.com/cn/articles/tyq-nodejs-event events ...
- springboot-web进阶(二)——AOP统一处理请求
一.AOP使用示例 AOP的概述在spring篇已经存在,这里不再赘述 1.准备 引入依赖 <dependency> <groupId>org.springframework. ...
- 八十八、SAP中ALV事件之二,事件的定义和事件子例程
一.我们来到SE37,找到REUSE_ALV_EVENTS_GET相关的定义 二.我们需要用到下面这3个事件 三.我们添加一个第五步,并把显示ALV座位第六步.在第五步中定义三个事件 四.在末尾,添加 ...
随机推荐
- Node.js 应用全链路追踪技术——全链路信息存储
作者:vivo 互联网前端团队- Yang Kun 本文是上篇文章<Node.js 应用全链路追踪技术--全链路信息获取>的后续.阅读完,再来看本文,效果会更佳哦. 本文主要介绍在Node ...
- java 启动查看jar包加载顺序并设置classpath
本文为博主原创,转载请注明出处: 1.idea查看jar包加载顺序 jdk8 可以通过 -XX:+TraceClassPaths 参数进行查看jar包的加载顺序 jdk11 可以通过 ...
- 【转载】JAVA - 解决:Java.lang.NoClassDefFoundError: javax/xml/bind/JAXBException
抄:https://www.cnblogs.com/sunylat/p/13339507.html 问题原因: 高版本的JDK中不包含javax.xml.bind包了! 解决方法: 1,如果是mave ...
- spring in action day07 RabbitMq
一:安装RabbitMq 记录下本人在win10环境下安装RabbitMQ的步骤,以作备忘. 第一步:下载并安装erlang erlang和rabbitmq对应版本说明:https://www.rab ...
- Vue视频 | 【Vue2 + Vue3 前端教程】完整版
目前大部分公司还是以vue.react技术为主的,而Vue中还是以Vue2为主流,但不可否认Vue3是未来所必须的且已有这个趋向了 今天给大家介绍一个Vue的教程 里面既有现在主流的Vue2 同时也存 ...
- 如何通过C#/VB.NET代码在Word中更改字体颜色
在日常工作中,我们有时会需要修改字体的颜色来突出文本重点,让读者更容易抓住文章要点.在今天这篇文章中,我将为大家介绍如何以编程方式,在Word更改字体颜色.本文将分为两部分分别介绍如何实现此操作.以下 ...
- STM32F0库函数初始化系列:PWM输出
void TIM1_Configuration(void) { TIM_TimeBaseInitTypeDef TIM_Time1BaseStructure; TIM_OCInitTypeDef TI ...
- day14-异常处理
异常处理 1.基本介绍 SpringMVC 通过 HandlerExceptionResolver 处理程序的异常,包括 Handler映射.数据绑定以及目标方法执行时发生的异常 有两种方案来进行异常 ...
- Cobaltstrike —— shellcode分析(一)
前言 搞iot搞久了,换个方向看看,改改口味. windows 常见结构体 在分析Cobaltstrike-shellcode之前我们得先了解一下windows下一些常见的结构体. X86 Threa ...
- 超声能指导持续临床缓解的长病程RA患者减停TNF抑制剂吗
标签:类风湿关节炎; TNF拮抗剂; 超声缓解; TNFi减停 超声能指导持续临床缓解的长病程RA患者减停TNF抑制剂吗 电邮发布日期: 2016年2月25日 截至目前,针对类风湿关节炎(RA),尚未 ...