Openlayers学习笔记——Geometry 和 Feature类

Geometry
Geometry类是feature对象的基本组成部分,Vector类采用Geometry类来存储一个要素的几何信息。

Feature
Feature类是Vector类用来在地图上展示几何对象,是Vector图层类一个属性。这个属性是个要素数组。
要素基类有两个部分,Geometry对象和attributes属性,attributes包含要素相关的数据。在OpenLayers中Vector图层对应着一个Feature.Vector类,该类除了继承了父类的Geometry和attributes属性之外,还添加了一个控制要素外观的style属性。
1.要素类的方法
%destroy():销毁要素对象;
%clone:复制要素对象;
%getVisibilrty():判断指定要素是否显示出来;
%move():将要素对象移动到location,location一般是OpenLayers.LonLat对象。
2.要素对象初始化
创建要素对象:
var my_feature=new OpenLayers.Feature.Vector(geometry_object,attributes,style);
geometry_object是个几何对象。attributes对象是个可选对象可指定要素数据的属性数据,附加数据如{‘building_area’:18000,’building_floors’:2},style对象也是可选的,可以指定要素的样式。

3.要素间的交互类——Control.SelectFeature
在OpenLayers中,矢量数据是加载到客户端的,所以与矢量要素的交互是实时的,快速的,在选择要素时它不需要向服务器请求数据。
在选择要素时,我们需要应用SelectFeature control类(OpenLayers.Control.SelectFeature)。该控制类允许我们与要素对象交互,比如当鼠标移动到或点击某一要素时做些处理。
%SelectFeature的使用
1) 在地图、矢量图层、要素添加到矢量图层后,我们首先创建selectFeature类
var select_feature_control=new Openlayers.Control.SelectFeature(vector_layer,{
multiple:false,
toggle:true,
multipleKey:’shiftKey’
});
map.addControl(select_feature_control);
2)完成上面代码,我们就已经将selectFeature添加到了地图上,但是在我们使用之前需要调用一个activate方法。
select_feature_control.activate();
3) 现在我们可以选择要素了,在此注意multiple属性值为false,说明在鼠标点击要素时一次只能选择一个,若是需要多选可以将其改为true,或者按住shift进行多选。
4) 选择要素过程中需要指定相关事件的执行函数,这里我们调用featureselected事件。
function select_feature(event){
document.getElmentById(‘map_feature_log’).innerHTML=”;

//Show the current selected feature (passed in from the
event object)
var display_text = ‘Clicked on: ‘
+ ‘<strong>’ + event.feature.attributes.location + ‘</
strong>’
+ ‘: ‘ + event.feature.attributes.description + ‘<hr
/>’;
document.getElementById(‘map_feature_log’).innerHTML =
display_text;

//Show all the selected features
document.getElementById(‘map_feature_log’).innerHTML += ‘All
selected features: ‘;
//Now, loop through the selected feature array
for(var i=0; i<vector_layer.selectedFeatures.length; i++){
document.getElementById(‘map_feature_log’).innerHTML
+=
vector_layer.selectedFeatures[i].attributes.
location + ‘ | ‘;
}
}
}
5) 注册函数与事件的联系
vector_layer.events.register(‘featureselected’,this,selected_feature);
6) 允许查看效果
转载自:https://blog.csdn.net/wxb880114/article/details/84185492

You may also like...