转载链接:http://www.cnblogs.com/wanghl-GIS/archive/2012/10/31/2748300.html
在OpenLayers中,控件SelectFeature主要用于操作(鼠标移入、移出、单击、双击)矢量图层(OpenLayers.Layer.Vector)的要素。那么它是如何实现的呢,还是让我们看代码吧。
- 首先我们还是先把所有要用到类实例化出来,参考代码:
1 var map=new OpenLayers.Map("map"); 2 var vectorLayer = new OpenLayers.Layer.Vector(); 3 map.addLayer(vectorLayer);
- 矢量要素的单击事件,仅需在实例化类时注册onSelect事件即可,参考代码:
1 var sf=new OpenLayer.Control.SelectFeature(vectorLayer,{onSelect:function(currentFeature){//todo}}); 2 map.addControl(sf);
- 矢量要素的鼠标移入事件,需要实例化时注册onSelect事件,同时设置hover属性为true,参考代码:
1 var sf=new OpenLayer.Control.SelectFeature(vectorLayer,{onSelect:function(currentFeature){todo},hover:true}); 2 map.addControl(sf);
- 矢量要素的鼠标各种事件的混合操作,如需要鼠标移入、移出、单击、双击等事件,参考代码:
1 var callbacks = { 2 over:function(currentFeature){}, 3 out:function(currentFeature){}, 4 dblclick:function(currentFeature){} 5 }; 6 var sf = new OpenLayers.Control.SelectFeature(vectorLayer,{ 7 onSelect:function(currentFeature){}, 8 }); 9 map.addControl(sf);
- 对于事件的混合操作行为,我们不能在callbacks对象中同时注册click和dblclick事件,这样的话单击事件会屏蔽双击事件。对于下述代码,dblclick事件永不触发:
1 var callbacks = { 2 over:function(currentFeature){}, 3 out:function(currentFeature){}, 4 click:function(currentFeature){}, 5 dblclick:function(currentFeature){} 6 }; 7 var sf = new OpenLayers.Control.SelectFeature(vectorLayer,{ 8 onSelect:function(currentFeature){}, 9 }); 10 map.addControl(sf);
相关推荐
OpenLayers.mobile.debug.js
OpenLayers.debug.js
OpenLayers.Control.LayerSwitcher 是一个继承自 OpenLayers.Control 的类,用于提供图层切换的功能。通过 OpenLayers.Class() 方法可以定义一个类,并继承自其他类。OpenLayers.Class() 方法的第一个参数是父类,第...
在提供的压缩包“OpenLayers.zip”中,有两个主要的子文件:v6.2.1.zip和v6.2.1-dist.zip。这表明我们获取的是OpenLayers库的两个不同版本。其中,v6.2.1.zip通常包含完整的源代码,这对于开发者来说非常重要,因为...
map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false})); map.addControl(new OpenLayers.Control.Permalink()); ``` 加载地图数据 使用 Geoserver 加载 WMS 地图数据。首先,需要在 ...
### OpenLayers 3.x Cookbook 第二版 知识点概览 #### 一、书籍基本信息与版权信息 - **书名**:《OpenLayers 3.x Cookbook》第二版 - **出版时间**:2016年3月 - **出版社**:Packt Publishing - **作者**: - ...
- 添加控制:`map.addControl(new OpenLayers.Control.ScaleLine());` - 自定义事件监听:`layer.events.register("click", layer, function(e) {...});` 6. **矢量对象** - 创建点、线、面:`new OpenLayers....
通过`new OpenLayers.Control.SelectFeature(layer)`创建了一个选择特征的控制,并将其添加到地图中,激活后用户可以与地图上的对象交互。 在文档中提到了坐标转换,这在处理地理坐标时非常重要。WGS1984是一种广泛...
var modifyControl = new OpenLayers.Control.ModifyFeature(vectorLayer); map.addLayers([vectorLayer]); map.addControl(modifyControl); modifyControl.activate(); ``` #### 四、鹰眼 “鹰眼”通常指...
《OpenLayers 2.10 Beginners Guide》是一本专为初学者设计的开源地图库OpenLayers的指南。这本书深入浅出地介绍了如何使用OpenLayers这一强大的JavaScript库来创建交互式的Web地图应用。OpenLayers是一个流行的...
在“vue整合openlayers.zip”中,我们可以预期包含的资源将指导我们如何在Vue项目中集成OpenLayers,并通过GeoServer获取和展示地理信息数据。下面,我们将深入探讨这三个技术的整合以及可能涉及的知识点: 1. **...
本篇将对OpenLayers 源码中的一些核心类进行分析,特别是与事件处理相关的类,如OpenLayers.Events、OpenLayers.Control等。阅读本文之前,建议读者具备一定的 OpenLayers 使用经验。 首先,我们来看OpenLayers....
- `OpenLayers.Control.LayerSwitcher`允许用户在地图上切换显示和隐藏图层,方便用户定制视图。 11. **标记(Markers)** - `OpenLayers.Marker`用于在地图上放置标记,通常与`OpenLayers.Icon`一起使用,自定义...
OpenLayers 是一个强大的开源JavaScript库,专用于在Web上创建交互式地图应用。它支持多种数据源,包括WMS、WFS、KML、GeoJSON等,并且兼容各种浏览器,包括移动设备。这个"openlayers开发用到的js库.zip"压缩包很...
`heatmap.js` 是基础库,而`heatmap-openlayers.js` 可能是专门为OpenLayers定制的一个版本,它可能包含了将heatmap.js集成到OpenLayers的特定函数或适配器。 下面是如何使用OpenLayers和heatmap.js创建热力图的...
《OpenLayers 2.10 初学者指南》是一本专为希望掌握OpenLayers库的开发者准备的资源。OpenLayers是一个流行的开源JavaScript库,用于在Web浏览器中展示地图和地理数据。它支持多种数据源,包括WMS、WFS、KML等,使...