OpenLayers地图重点属性摘录.docx

一：OpenLayers1 OpenLayers：常量 version_number标识版本二：BaseTypes2 BaseTypes（基本类型）：这里定制了Openlayers中用到的string、number、function、array3 Bounds（边界）：属性 left、bottom、right、top、centerLonLat方法 extend 用于扩展边界，toBBox用于绑定bounds = new OpenLayers.Bounds();bounds.extend(new OpenLayers.LonLat(4,5);bounds.extend(new OpenLayers.LonLat(5,6);bounds.toBBOX(); / returns 4,5,5,64 LonLat（经纬度）：属性 lon经度、lat纬度注意：如果地图不是地理投影，那么调用的LonLat表示的是地图上的x、y轴坐标，为（0,0）表示坐标轴原点例子：map.setCenter(new OpenLayers.LonLat(116.3876,39.8983),13);最后一个参数表示Zoom:放大倍数5 Pixel（像素）：属性 x、y表示x和y坐标6 Size：属性 w、h表示宽和高三：Console7 Console：用于调试和把错误等输出到“控制台”上，需要结合使用firebug四：Control8 Control（控件）：使用方法：方法一：var map = new OpenLayers.Map(map, controls: );map.addControl(new OpenLayers.Control.PanZoomBar();方法二：var map = new OpenLayers.Map(map, controls: new OpenLayers.Control.PanZoomBar()，new OpenLayers.Control.Navigation() );9 Button（按钮）：方法 trigger（） 点击按钮的时候会调用使用方法：var button = new OpenLayers.Control.Button( displayClass: MyButton, trigger: myFunction);panel.addControls(button);10 DragPan（鼠标拖动地图）11 DrawFeature（在矢量图上画点、线、面）var lines = new OpenLayers.Layer.Vector(Lines, styleMap: new OpenLayers.StyleMap( pointRadius: 3, strokeColor: #ff3300, strokeWidth: 3, fillOpacity: 0 );var panel = new OpenLayers.Control.Panel( displayClass: olControlEditingToolbar);var draw = new OpenLayers.Control.DrawFeature( lines, OpenLayers.Handler.Path, displayClass: olControlDrawFeaturePath, title: Draw Lines);panel.addControls( new OpenLayers.Control.Navigation(title: Navigate), draw);map.addControl(panel);12 EditingToolbar（编辑工具条）EditingToolbar包含4个控件：draw point、draw lines、draw polygon、pan navigation构造函数 参数：layer（Openlayer.Layer.Vector）、options例子：var vector = new OpenLayers.Layer.Vector(Editable Vectors);map.addLayers(vector);map.addControl(new OpenLayers.Control.EditingToolbar(vector);13 Geolocate（地理定位）把w3c geolocation API包装成控件，与地图绑定，位置发生变化时触发事件14 GetFeature15 Graticule（格子线）在地图上以grid显示经纬线16 KeyboardDefaults：增加了用键盘实现平移缩放功能map.addControl(new OpenLayers.Control.KeyboardDefaults()；17 LayerSwitcher（图层切换功能） map.addControl(new OpenLayers.Control.LayerSwitcher();18 Measure（用于测量绘图）：方法 getArea和getLength 19 MousePosition（鼠标位置）：显示鼠标指针移动时的地理坐标 map.addControl(new OpenLayers.Control.MousePosition();20 MouseToolbar（鼠标工具栏）：有拉框放大的功能，但是需要按住shift键，所以不推荐使用，要实现相同的功能可以使用NavToolbar21 Navigation（导航）：导航控件处理鼠标事件（拖动、双击、滚动）的地图浏览注意：这个控件是默认添加到地图中的22 NavToolbar：加入了两个mousedefaults控件，通过使用zoomBox实现拉框放大功能map.addControl(new OpenLayers.Control.NavToolbar();23 OverviewMap（鹰眼）：默认在地图的右下角 map.addControl(new OpenLayers.Control.OverviewMap();24 Pan（平移）25 Panel（面板）：Panel控件是其他控件的容器Each control in the panel is represented by an icon，即表示添加到面板里面的控件都是用图像表示的26 PanZoom（平移缩放）：由OpenLayers.Control.PanPanel和OpenLayers.Control.PanPanel这两个控件组成，具有平移和缩放的功能图标：map.addControl(new OpenLayers.Control.PanZoom();27 PanZoomBar（平移缩放工具栏）：由OpenLayers.Control.PanPanel和OpenLayers.Control.ZoomBar这两个控件组成，具有平移和缩放功能，这控件和PanZoom的区别见图标图标：map.addControl(new OpenLayers.Control.PanZoomBar();28 Permalink（永久链接）：点击永久链接将用户返回到当前地图视图例子：map.addControl(new OpenLayers.Control.Permalink();29 Scale（比例尺）：以1:1这种比率样式显示当前地图的比例例子：map.addControl(new OpenLayers.Control.Scale();30 ScaleLine（比例尺）：以线段指标的样式显示当前地图的比例例子：map.addControl(new OpenLayers.Control.ScaleLine();31 SelectFeature 通过点击或是悬停选择给定层上的Feature构造函数 参数：layer（Openlayers.Layer.Vector）、options属性：multipleKeytoggleKeymultiple：是否允许同时选择多个图形clickout：取消功能，当点击图形外的任何东西，取消对图形的选择hover：鼠标悬停例子：selectControl = new OpenLayers.Control.SelectFeature( vectors1, vectors2, clickout: true, toggle: false, multiple: false, hover: false, toggleKey: ctrlKey, / ctrl key removes from selection multipleKey: shiftKey / shift key adds to selection );map.addControl(selectControl);selectControl.activate();32 SLDSelect33 Snapping（编辑矢量图层时用于捕捉）34 Split35 TouchNavigation（触摸导航）：只针对触摸功能的设备的地图绘制应用程序36 TransformFeature37 WMSGetFeatureInfo：使用WMS的查询来获取地图上一个点的信息，显示的格式是Format的38 WMTSGetFeatureInfo：使用WMTS的查询来获取地图上一个点的信息，显示的格式是Format的39 ZoomBox(拉框放大的功能)：与NavToolbar同样，属性 out 可以实现拉框缩小（这个控件没有实现）Q：在界面中使用map.addControl(new OpenLayers.Control.ZoomBox(alwaysZoom:true);并不能实现将拉框控件添加到地图中？使用创建新类的方法下面这段代码中调用的this是哪一层？controls0是哪个控件？OpenLayers.Control.CustomNavToolbar = OpenLayers.Class(OpenLayers.Control.Panel, initialize: function(options) OpenLayers.Control.Ptotype.initialize.apply(this, options); this.addControls( new OpenLayers.Control.ZoomBox(alwaysZoom:true) );/this.displayClass = olControlNavToolbar , draw: function() var div = OpenLayers.Control.Ptotype.draw.apply(this, arguments); this.defaultControl = this.controls0; return div; ); map.addControl(new OpenLayers.Control.CustomNavToolbar();40 ZoomIn 放大 使用的时候可以通过PanZoomBar控件，ZoomIn每次放大一个级别41 ZoomOut 缩小 使用的时候可以通过PanZoomBar控件，ZoomOut每次缩小一个级别42 ZoomPanel 包括OpenLayers.Control.ZoomIn和OpenLayers.Control.ZoomToMaxExtent和OpenLayers.Control.ZoomOut 图标 map.addControl(new OpenLayers.Control.ZoomPanel();43 ZoomToMaxExtent 显示地图的最大程度的缩小五：Map44 Map （地图）见资料构造函数 参数：div（页面中要显示的标签）、options属性：allOverlays：？3maxExtent：地图的最大范围units：地图的单位projection：覆盖默认的投影字符串地图，如果适当，最好还设置maxExtent、maxResolution、unitsmaxResolution：最大分辨率numZoomLevels：缩放级别数目知道最大分辨率和缩放级别数目可以直接知道最小和最大的缩放级别displayProjection：显示的投影级别，与mouseposition控件结合使用，即设置mouseposition显示使用的坐标系/ create a map with default options in an element with the id map1var map = new OpenLayers.Map(map1);/ create a map with non-default options in an element with id map2var options = maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000),/最大显示范围 maxResolution: 156543,/最大分辨率 units: m,/ projection: EPSG:41001;var map = new OpenLayers.Map(map2, options);/ map with non-default options - same as above but with a single argumentvar map = new OpenLayers.Map( div: map_id, maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000), maxResolution: 156543, units: m, projection: EPSG:41001);/ create a map without a reference to a container - call render latervar map = new OpenLayers.Map( maxExtent: new OpenLayers.Bounds(-200000, -200000, 200000, 200000), maxResolution: 156543, units: m, projection: EPSG:41001);六：Marker45 Marker 包括一个OpenLayers.LonLat和OpenLayers,Icon，注意：标记一般都是添加到一个特殊的图层，即OpenLayers.Layer.Markers使用方法：方法一：var markers = new OpenLayers.Layer.Markers( Markers );map.addLayer(markers);var size = new OpenLayers.Size(21,25);var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);var icon = new OpenLayers.Icon(/dev/img/marker.png, size, offset);markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,0),icon);markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,0),icon.clone();方法二：var markers = new OpenLayers.Layer.Markers( Markers );map.addLayer(markers);markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,0),new OpenLayers.Icon(/dev/img/marker.png);注意：标记不能使用同样的图标，但是可以使用clone（）方法实现对图标的克隆46 Box 用矩形做标记，同样box要添加到Boxes这个图层里面Q：下面这个程序为什么没有效果？var boxes = new OpenLayers.Layer.Boxes( Boxes );map.addLayer(boxes);var bounds = new OpenLayers.Bounds(-10,50,5,60);var box = new OpenLayers.Marker.Box(bounds);/box.events.register(click, box, function (e) / this.setBorder(yellow); / );boxes.addMarker(box);七：Popup47 Popup 构造函数参数有六个：ID、lonlat、contentSize、contentHTML、closeBox、closeBoxCallbackpopup = new OpenLayers.Popup(chicken,/标识符 new OpenLayers.LonLat(5,40),/在地图上的弹出位置 new OpenLayers.Size(200,200),/弹出的提示框的大小 example popup,/提示框中显示的内容 true);/是否显示关闭框map.addPopup(popup);通过使用下面的方法，可以在标记中添加点击事件，点击时弹出提示框marker.events.register(click, marker, function (e) map.addPopup(popup); popup.show();/如果不加这个方法，popup只有在第一次点击marker的时候才会出现，之后点击都没有效果 );48 FramedCloud 继承Popup，弹出的形状与Popup是不一样的framedcloud = new OpenLayers.Popup.FramedCloud(chicken,/标识符 new OpenLayers.LonLat(5,40),/在地图上的弹出位置 new OpenLayers.Size(200,200),/弹出的提示框的大小 example popup,/提示框中显示的内容 null, true);/是否显示关闭框map.addPopup(framedcloud);49 Anchored50 AnchoredBubble八：Icon51 Icon （图标） 重要属性：url图片源、size图片大小、offset偏移量图标一般与marker结合使用Q：能不能将图标与其他控件结合？能！var size = new OpenLayers.Size(21,25);/用来控制图标的大小var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);/用来控制图标的偏移量var icon = new OpenLayers.Icon(/dev/img/marker.png, size, offset);/定义图标九：Layer52 Layer （图层）.openlayersopenlayers的类与方法.doc53 ArcGIS93Rest 使用ESRI的ArcGIS Server 9.3地图服务中显示的数据54 ArcIMS 使用ESRI公司的ArcIMS地图服务中显示的数据55 Bing 使用ESRI的Bing地图56 Boxes 为box提供图层 方法：drawMarker、removeMarker57 GeoRSS 添加GeoRSS点功能58 GML 通过解析GML文件创建一个适量图层 注意：过时，在3.0中被移除59 Google 构造函数中的参数：name显示的名称、options例子：var ghyb = new OpenLayers.Layer.Google(Google Hybrid,type: G_HYBRID_MAP, sphericalMercator: true);60 Grid 使用瓷砖晶格 层的基类61 VirtureEarth例子：var veroad = new OpenLayers.Layer.VirtualEarth(Virtual Earth Roads,type: VEMapStyle.Road, sphericalMercator: true);var veaer = new OpenLayers.Layer.VirtualEarth(Virtual Earth Aerial,type: VEMapStyle.Aerial, sphericalMercator: true);var vehyb = new OpenLayers.Layer.VirtualEarth(Virtual Earth Hybrid,type: VEMapStyle.Hybrid, sphericalMercator: true);62 Yahoo例子：var yahoo = new OpenLayers.Layer.Yahoo(Yahoo Street,sphericalMercator: true);var yahoosat = new OpenLayers.Layer.Yahoo(Yahoo Satellite,type: YAHOO_MAP_SAT, sphericalMercator: true);var yahoohyb = new OpenLayers.Layer.Yahoo(Yahoo Hybrid,type: YAHOO_MAP_HYB, sphericalMercator: true);63 WMSOpenLayers.Layer.WMS实例是用来显示OGC Web地图服务的数据。构造函数的参数：name（显示的名称）、url（来源）、params、options例子：var wms = new OpenLayers.Layer.WMS(NASA Global Mosaic,/wms.cgi, layers: modis,global_mosaic);var wms = new OpenLayers.Layer.WMS( OpenLayers WMS, /wms/vmap0?, layers: basic );十：StyleMap64 StyleMap构造函数 参数：style、optionsStyle表示写入渲染方法（“default”, “temporary”, “select”, “delete”）例子：var styles = new OpenLayers.StyleMap( default: strokeWidth: 2, select: strokeColor: #0099cc,strokeWidth: 4 );方法 addUniqueValueRules 用于向指定渲染方法中的样式对象添加规则参数 renderIntent 要添加规则的渲染方法 property 给哪个属性创建规则 symbolizers context 例子： styles.addUniqueValueRules(default, RP_TYPE, 10: strokeColor: #000000, strokeWidth: 2, 12: strokeColor: #222222, strokeWidth: 2, 14: strokeColor: #444444, strokeWidth: 2, 16: strokeColor: #666666, strokeWidth: 2, 18: strokeColor: #888888, strokeWidth: 2, 19: strokeColor: #666666, strokeWidth: 1 );定义出现在地图界面上的点线面的样式，添加到地图图层中，如果在地图上画点、线、面时则按照定义的样式显示方法一： 1 2 3 4Symbolizer-Rule-Style-StyleMap-Vector1. New Rule (Symbolizer )2. Style.addRules(Rule)3. New StyleMap(Style)4. New Vector(styleMap:StyleMap)或者是New style(,rules:new Rule(symbolizer)只是提供一种方式，写法还有很多种格式例子：/定义点线面的样式，然后通过style和rule增加到measure控件中 var sketchSymbolizers = Point: pointRadius: 2, graphicName: square, fillColor: white, fillOpacity: 1, strokeWidth: 1, strokeOpacity: 1, strokeColor: #333333 , Line: strokeWidth: 2, strokeOpacity: 1, strokeColor: #ff0000, /strokeDashstyle: dash , Polygon: strokeWidth: 2, strokeOpacity: 1, strokeColor: #ff0000, fillColor: white, fillOpacity: 0.3 ; var style = new OpenLayers.Style();/定义风格，样式style.addRules( new OpenLayers.Rule(symbolizer: sketchSymbolizers)/增加规则，支持（点、线、面）这三个是键 );var styleMap = new OpenLayers.StyleMap(default: style);.var lines = new OpenLayers.Layer.Vector(Lines, styleMap: styleMap);var polygons = new OpenLayers.Layer.Vector(Polygons,styleMap:styleMap); map.addLayers(lines,polygons);方法二： 1StyleMap-Vector1. new StyleMap()2. StyleMap.addUniqueValueRules3. New Vector(styleMap:StyleMap)例子：/ give the features some stylevar styles = new OpenLayers.StyleMap( default: strokeWidth: 2 , select: strokeColor: #0099cc, strokeWidth: 4 );/ add rules from the above lookup tablestyles.addUniqueValueRules(default, RP_TYPE, 10: strokeColor: #000000, strokeWidth: 2, 12: strokeColor: #222222, strokeWidth: 2, 14: strokeColor: #444444, strokeWidth: 2, 16: strokeColor: #666666, strokeWidth: 2, 18: strokeColor: #888888, strokeWidth: 2, 19: strokeColor: #666666, strokeWidth: 1 );var vectors = new OpenLayers.Layer.Vector(Lines, strategies: new OpenLayers.Strategy.Fixed(), /战略 protocol: new OpenLayers.Protocol.HTTP(/协议 url: data/roads.json, format: new OpenLayers.Format.GeoJSON() ), styleMap: styles ); map.addLayer(vectors);十一：Style65 Style66 参数：style、options67 addRules 将规则添加到样式中68 context：上下文如果没有指定上下文就用attributes十二：Rule69 Rule70 表示一个SLD规则71 属性 symbolize十三：Symbolize72 Symbolize73 Line 用来渲染线功能属性：strokeColor：线条的颜色strokeOpacity：线条的不透明度strokeWith：宽度strokeLinecap：类型（“butt”, “round”, or “square”）strokeDahstyle：根据SLD规范的虚线样式74 Point属性：strokeColor：线条的颜色strokeOpacity：线条的不透明度strokeWith：宽度strokeLinecap：类型（“butt”, “round”, or “square”）strokeDahstyle：根据SLD规范的虚线样式fillColor：RGB十六进制填充颜色fillOpacity：填充不透明度pointRadius：一个像素点的半径75 Polygon属性：strokeColor：线条的颜色strokeOpacity：线条的不透明度strokeWith：宽度strokeLinecap：类型（“butt”, “round”, or “square”）strokeDahstyle：根据SLD规范的虚线样式fillColor：RGB十六进制填充颜色fillOpacity：填充不透明度76 Raster77 Text属性： label：标签的文本fontFamily：标签的字体家族fontSize：字体大小fontWeight：字体粗细fontStle：字体样式十四：Renderer78 Renderer渲染类。在OpenLayers中，渲染功能是作为矢量图层的一个属性存在的，我们称之为渲染器，矢量图层就是通过这个渲染器提供的方法将矢量数据显示出来。例子：var renderer = OpenLayers.Util.getParameters(window.location.href).renderer; renderer = (renderer) ? renderer : OpenLayers.Layer.Vtotype.renderers;十五：Feature79 Vector矢量要素用这个类进行几何描述构造函数 参数：geometry：这个功能要表示的几何attributes：style：样式例子：var features = new Array(50);for (var i=0; ifeatures.length; i+) featuresi = new OpenLayers.Feature.Vector( new OpenLayers.Geometry.Point( (360 * Math.random() - 180, (180 * Math.random() - 90), type: 5 + parseInt(5 * Math.random(); 过程：1. Feature=new OpenLayers.Feature.Vector()2. Stylemap=New OpenLayers.StyleMap()3. Vector=new OpenLayers.Layer.Vector(styleMap:stylemap);4. Vector.addFeatures(Feature)十六：Projection80 Projection用于坐标系里坐标的转换构造函数 参数：projCode、optionsEPSG：4326 描述经纬度坐标，EPSG：900913 描述x/y坐标必须要将中心点坐标强制转换var proj = new O