`

geometry类和feature类

GeometryCollection 
阅读更多

我们上面的章节一直使用的都是feature，但是feature，中有个非常重要的属性就是geometry对象，他保存着对象的事件形态，就是我们vectorLayer上

显示的几何图形。

eg  我们要创建一个Feautre，里面会包装一个Feature

var feature_point = new OpenLayers.Feature.Vector({new OpenLayers.Geometry.Point(lon,lat)})

 

几何类的方法

atPoint(lonlat,tolerancelon,tolerancelat)  参数lonlat为OpenLayers.LonLat,后面的两个参数为点的阈值，因为feature在地图是以带style的点。

calculateBounds()          重新计算集合的边界，但是不返回任何值

clearBounds():             把geometry的边界设为null

  clone():                       复制一个OpenLayers.Geometry对象

destroy()                 销毁一个geometry，但是如果这个geometry是feature的一部分，销毁会失败

distanceTo  (geometry, options)           这个方法会返回自己与最近或是传入geometry之间距离，options有个属性，distance如果为true将会返回

                                                               包含x0y0,x1y1和距离的对象，为false的话，会返回距离数，但是要注意map的units设置的单位

extendBounds(bounds)                              不是很明白

getArea（）                                       返回一个{Float}，包含这个geometry的面积

getBounds（）                 返回{openLayers.Bounds}对象

getCentroid()                    返回geometry的中心点，{OpenLayers.Geometry.Point}对象  

getLength()                      返回一个geometry覆盖的长度{Flot}

getVertices(nodes)            返回geometry中所有的节点对象

toString（）                    返回wkt几何描述文本

 

Geometry 子类

Geometry.Point:包含(x,y)的对象

var my_point = new OpenLayers.Geometry.Point(-50,42);

Geometry.Collection:这是一个集合类，里面存放着Geometry的对象。LineString就是继承这个类。同几何对象的数组实例化。

var geom_collection = new OpenLayers.Geometry.Collection([geometry_point,geometry_line]);

Geometry.MultiPoint：这是一个点的几何对象，LineString就是继承的这个类，传递实例化对象的数组

var geom_multipoint = new OpenLayers.Geometry.MultiPoint([point1,point2])

Geometry.Curve:      曲线

Geometry.LineString:由点连接形成线,不能少于两个点的线

var geom_multi_line = new OpenLayers.Geometry.LineString([point1,point2]):

Geometry.MultiLineString:：多线，不能少于两根线

var geom_multiLineString = new OpenLayers.Geometry.MultiLineString([line1,line2]);

Geometry.LinearRing:这是一个闭合的线对象，在几何上表达就是第一点，也是最后一点。

var geom_linear_ring = new OpenLayers.Geometry.linearRing([point1,point2,point3,point1])

Geometry.Polygon:这个类是一个Geometry.LinearRing的数组。

var geo_polygon = new OpenLayers.Geometry.Polygeo([linear1,linear2,linear3])

Geometry.MultiPolygon:是Geometry.polygon的数组

Geometry子类的方法

每个子类都有自己特有的方法或者是实现，我们可以参考开发文档。

 

Feature类

它一个有Geometry，和自身属性加上Style组成的类

 

方法

destroy(),销毁一个Feature Object

clone（） 复制一个feature

getVisibility（） 返回{boolean}，feature是否可见

move(location) ,移动，可以传入OpenLayers.LonLat  和 OpenLayers.Pixel

onScreen(boundsOnly)     不是很清楚

 

使用SectFeature Control 与地图交互

 

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>地图交互</title>  
<script type="text/javascript" src="OpenLayers.debug.js"></script>  
<script type="text/javascript">  
    var map;  
    var vector_layer;  
      
    function init() {  
        //创建地图  
        map = new OpenLayers.Map('map');  
      
        //创建wms图层  
        var wms_layer = new OpenLayers.Layer.WMS('OpenLayers WMS',  
                'http://vmap0.tiles.osgeo.org/wms/vmap0', {  
                    layers : 'basic'  
                }, {});  
        //map.addLayer(wms_layer);  
      
        //创建矢量图层   
        vector_layer = new OpenLayers.Layer.Vector('Basic Vector Layer');  
    //  map.addLayer(vector_layer);  
          
    map.addLayers([wms_layer,vector_layer]);  
        //创建并添加feature  
        var feature_point_1 = new OpenLayers.Feature.Vector(  
                new OpenLayers.Geometry.Point(6.055, 46.234), {  
                    'location' : 'Cern',  
                    'description' : "Stand back, I'm going to try science!"  
                });  
        var feature_point_2 = new OpenLayers.Feature.Vector(  
                new OpenLayers.Geometry.Point(-129, 3), {  
                    'location' : 'The Sea',  
                    'description' : 'Here be dragons'  
                });  
        var feature_polygon = new OpenLayers.Feature.Vector(  
        //We'll make a polgon from a linear ring object, which consists of points  
        new OpenLayers.Geometry.Polygon(new OpenLayers.Geometry.LinearRing([  
                new OpenLayers.Geometry.Point(-124.2, 41.9),  
                new OpenLayers.Geometry.Point(-120.1, 41.9),  
                new OpenLayers.Geometry.Point(-120, 39),  
                new OpenLayers.Geometry.Point(-114.5, 34.9),  
                new OpenLayers.Geometry.Point(-114.7, 32.7),  
                new OpenLayers.Geometry.Point(-117.1, 32.5),  
                new OpenLayers.Geometry.Point(-120, 34),  
                new OpenLayers.Geometry.Point(-123.7, 38.4)  
        //We won't pass in the first point, the polygon will close automatically  
        ])), {  
            'location' : 'Fanghorn Forest',  
            'description' : 'Land of the Ents'  
        });  
        vector_layer.addFeatures([ feature_point_1, feature_point_2,  
                feature_polygon ]);  
      
        //创建并添加  selectFeature control  
        var select_feature_control = new OpenLayers.Control.SelectFeature(  
                vector_layer, {  
                    multiple : false,  
                    toggle : true,  
                    toggleKey : 'ctrlKey',  
                    multipleKey : 'shiftKey'  
                });  
        map.addControl(select_feature_control);  
      
        //激活控件  
        select_feature_control.activate();  
      
        //注册事件   
        vector_layer.events.register('featureselected', this, selected_feature);  
        vector_layer.events.register('featureunselected', this,unselected_feature);  
      
        if (!map.getCenter()) {  
            map.zoomToMaxExtent();  
        }  
      
    }  
    //触发选中事件   
    function selected_feature(event) {  
        //clear out the log's contents  
        document.getElementById('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  
                    + ' | ';  
        }  
    }  
    //没有被选中   
    function unselected_feature(event) {  
        var display_text = event.feature.attributes.location + ' unselected!'  
                + '<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  
                    + ' | ';  
        }  
    }  
</script>  
</head>  
<body onload="init()">  
    <div id="map" style="width: 500px; height: 500px;"></div>  
    <div id="map_feature_log">显示详情</div>  
</body>  
</html>
分享到：
| OpenLayers基底图层和叠加图层区别
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics