`
wxb880114
  • 浏览: 678788 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

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) 允许查看效果
   

               
    
分享到:
评论

相关推荐

    地图个人开发笔记和Demo

    —— 1.1 OlMap 基础类 —— 1.2 openlayers 实例化地图 —— 1.3 openlayers地图OSM形式 —— 1.4 openlayers地图XYZ形式 —— 1.5 国家地理信息公共服务平台 天地图 —— 1.6 天地图.四川 —— 1.7 天地图.西藏 ...

    openlayers6学习笔记

    openlayers6学习笔记,节省你的学习成本

    openlayers3.0学习笔记

    openlayers3.0学习笔记,节省你的学习成本

    openlayers3 多边形相交判断

    OpenLayers 3提供了`ol.geom.Polygon`类,用于创建和操作多边形对象。 1. **创建多边形**:在OpenLayers 3中,你可以通过传递一个坐标数组来创建一个多边形。例如: ```javascript var polygon1Coordinates = [[...

    OpenLayers

    OpenLayers 提供了 `ol.Feature` 和 `ol.geom` 类来创建几何对象,如点、线和面,并将其添加到矢量图层中。例如,添加一个标记: ```javascript var marker = new ol.Feature({ geometry: new ol.geom.Point([0, 0...

    OpenLayers-2.7学习文档和资源包

    ### OpenLayers-2.7 学习文档与资源包知识点概览 #### 一、引言:OpenLayers — 开源地图...通过学习 OpenLayers-2.7 的文档和资源包,可以更好地理解和掌握其核心概念和技术细节,从而在实际项目中发挥出更大的价值。

    openlayers中文api.zip

    OpenLayers 是一个强大的开源JavaScript库,专用于在Web上创建交互式地图应用。这个"openlayers中文api.zip"文件包含了...中文API文档的出现,无疑为中文开发者提供了极大的便利,降低了学习和使用OpenLayers的门槛。

    《WebGIS之OpenLayers全面解析》一书源码

    OpenLayers作为业内使用最为广泛的地图引擎之一,已被各大GIS厂商和广大WebGIS二次开发者采用。借助OpenLayers强大的扩展功能,可以实现与各个不同的WebGIS平台产品相结合,开发出各具特色的WebGIS应用系统。 本书...

    WebGIS之OpenLayers全面解析

    OpenLayers作为业内使用最为广泛的地图引擎之一,已被各大GIS厂商和广大WebGIS二次开发者采用。借助OpenLayers强大的扩展功能,可以实现与各个不同的WebGIS平台产品相结合,开发出各具特色的WebGIS应用系统。 本书...

    OpenLayers_2.10_Beginners_Guide_Code

    `OpenLayers.Layer.Vector`类用于创建矢量图层,`OpenLayers.Geometry`类则提供了几何对象的构建。 7. WFS服务:OpenLayers可以与Web Feature Service (WFS)交互,用于读取和编辑地理空间数据。`OpenLayers....

    OpenLayer学习笔记——第一天

    gis小白从零开始学习,需要懂得前端基础知识 不bb,开干 快速开始 一、形成地图 导入文件 方式一:cnd导入 方式二:下载包导入 github地址:https://github.com/openlayers/openlayers/releases // 创建地图 ...

    openlayers中文.rar

    这个"openlayers中文.rar"压缩包提供了一份中文手册,对于想要学习和掌握OpenLayers的开发者来说,是一份非常实用的学习资源。 1. **OpenLayers基本概念**: - **地图层(Layers)**:OpenLayers中的地图由多个...

    openlayers学习文档

    这个"openlayers学习文档"可能包含了从基础到进阶的各种教程、示例代码和实践指南,非常适合初学者了解和掌握OpenLayers的核心功能和使用技巧。 OpenLayers 的主要特点包括: 1. **跨平台**:OpenLayers 支持所有...

    openlayers常用功能简单封装

    本教程将深入探讨如何对OpenLayers的常用功能进行简单封装,以提升开发效率和代码复用性。 首先,我们从地图要素创建开始。在OpenLayers中,要素(Feature)是地图上的几何对象,可以是点、线或面。你可以通过`ol....

    OpenLayers动画效果显示路线

    首先,动画效果在OpenLayers中通常是通过时间序列和地理坐标点的移动来实现的。`Point.js`可能包含了定义这些坐标点的数据结构,它们可能是沿着路线的一系列地理位置。在JavaScript中,你可以使用`setTimeout`或`...

    openLayers geoserver常见问题

    OpenLayers API和类用于画点、线、面,如`OpenLayers.Geometry.Point`, `OpenLayers.Geometry.LineString`, `OpenLayers.Geometry.Polygon`。 了解OGC标准的WMS(Web Map Service)、WFS(Web Feature Service)和...

Global site tag (gtag.js) - Google Analytics