openlayers3 pointermove onmousemove 显示feature信息
2017-07-26 17:42
239 查看
由于过渡到openlayers3 4版本后,整体结构接口有些变化,导致很多原来用过的功能使用方式发生了改变。比如:鼠标移动到图层上,获取feature属性,弹出信息。 官网例子地址:vector-layer pointmove 根据例子实际项目应用:1.添加需要查询的vector图层,
if (feature) { content.innerHTML = feature.getId() + ': ' + feature.get('name'); overlay.setPosition(evt.coordinate) } else { content.innerHTML = ' '; overlay.setPostion(undefined) } };
var vectorLayer = new ol.layer.Vector({ source: new ol.source.Vector({ url: 'https://openlayers.org/en/v4.2.0/examples/data/geojson/countries.geojson', format: new ol.format.GeoJSON() }) });2.map绑定鼠标移动事件,查询
map.on('pointermove', function(evt) { if (evt.dragging) { return; } displayFeatureInfo(evt); });3.通过pupup展示feature属性信息(注:popup实例点击打开链接http://openlayers.org/en/latest/examples/popup.html) var displayFeatureInfo = function (evt) { var pixel = map.getEventPixel(evt.originalEvent); var feature = map.forEachFeatureAtPixel(pixel, function (feature) { return feature; });//查询方式有很多
相关文章推荐
- Ext.grid.feature.Grouping页头分组如何显示其他信息
- Openlayers之显示瓦片网格信息
- Javascript 400例-001-打开新窗口显示广告信息
- vsftpd文件服务设置更改目录时显示欢迎信息
- (原创)利用HttpModule非侵入式的显示异常信息
- 微信扫描二维码网页跳转显示信息
- [JSP 网站开发] 用户登录信息同步显示方案(struts2,jQuery)
- Swing鼠标悬停时巧用上下文菜单显示提示信息
- ls -l显示年月日时分秒信息
- 1 使用自定义列显示班级学生信息,要求能够进 行删除和修改,删除时给出提示:如 “ 确信要删 除 - 张三 - 吗? ” ,其中张三为当前行的姓名
- JSP实现简单的用户登录并显示出用户信息的方法
- 前端_输入信息提交上边显示
- 使用canvas在一张图片上动态显示文字信息,并支持图片下载。
- 求助!用openlayers如何实现读入数据库的地理位置信息,然后进行实时同步定位??万分感谢!
- mysql 中显示 table 的基本信息
- 显示调试异常信息
- 自定义单元格显示多行文本信息不完整
- CISCO设备Log&debug信息显示时间精度修改
- MFC(win32GUI)程序中显示Dos调试信息.console.显示控制台界面.标准输出.
- 创建一个学生类(Student),包括学号和成绩,编程输入和显示学生的信息,建立一个人类(Person),包含姓名、性别和年龄,并作为学生类的基类