OpenLayers3参考API

目录

OpenLayers3参考API

sf2gis@163.com

2015年6月17日

 

1 框架

1.1 地图:ol.Map。

目标:配置地图窗口的全部属性。

方法:配置map。

图层:layers(图层:ol.layer.Layer。

视图:view(显示窗口:ol.View。

html组件:target。

控件:controls(控件:ol.control。)。ol.control.defaults(常用控件)。

交互工具:interactions()。默认是ol.interactions.defaults。

添加、删除交互工具:addInteraction(),removeInteraction()。

添加图层:addLayer()。

1.1.1事件

鼠标移动:pointermove

1.2 图层:ol.layer.Layer。

目标:配置地图数据源(source)及其属性(透明度,饱和度,对比度等)。

方法:

1.2.1属性:ol.Attribution

目标:右下角用于显示数据源的HTML。

方法:html,一段标示HTML。需要用©公司链接的方式标示权利。

示例:

      var tileAttr=new ol.Attribution({

      html: ‘All maps © ‘ + ‘<ahref=”http://www.localhost:8080/”>MyTest GeoServer</a>’

    });

1.2.2数据源:ol.source。

目标:构建各种不同服务的数据源请求。

方法:数据源:ol.source。

1.2.3样式:ol.style

参见:样式:ol.style。

1.3 显示窗口:ol.View。

目标:渲染地图

方法:设置坐标系统,中心点,缩放,旋转等。

默认坐标系统:EPSG:3857。

显示指定范围:fitExtent()。

旋转值:使用弧度。getRotation(),setRotation()。

获取坐标系统:getProjection()。

2 基础

2.1 基类:ol.Object。

目标:实现基本功能(事件,属性)。是所有专用类的基类。

方法:实现了事件功能和属性功能。

2.2 容器:ol.Collection

目标:扩展Array,提供快捷操作。

方法:

构造:以数据初始化(JSON数组初始化)。

扩展:extend(array),向当前容器的尾部中添加新数组。

索引:item(index),获取第index个数据。

2.3 格式解析:ol.format。

目标:读写不同格式的数据。

方法:

2.3.1GeoJSON:ol.format.GeoJSON,操作GeoJSON数据,包括各种读写方法。

geojson参见:GeoJSON.docx

2.4 样式:ol.style。

渲染样式。

Style:基本样式,可以设置各种不同的细节样式。

Stroke:断点线样式。

2.4.1styleFunciton:样式选择函数

目标:为不同的ol.layer.Vector提供不同的style的函数。

方法:线Stroke、填充Fill、文本Text、圆形Circle和预定义图形RegularShape、图标Icon。

2.4.1.1  文本样式:Text

目标:显示指定的文本。

方法:字体font,偏移offsetX/offsetY,比例尺scale,旋转rotate(顺时针度),文本text,对齐方式textAlign,基线textBaseline,填充fill,边框stroke。

2.4.1.2  动态生成样式:styleFunction(feature,resolution)。

必须返回一个style数组。

示例:

var styleFunction =function(feature, resolution) {

  returnstyles[feature.getGeometry().getType()];

};

2.5 事件:ol.event

事件条件:ol.event.condintion

3 地理相关

3.1 矢量元素:ol.Feature。

目标:矢量实体,包括几何和属性。

方法:

geometry:几何实体。

3.2 元素样式覆盖:ol.FeatureOverlay

目标:多个元素的样式组。

方法:

元素列表:features。

地图:map。

样式:style。

3.3 坐标系统:ol.proj。

目标:坐标系统定义和转换。

方法:

坐标系统定义:ol.proj.Projection。

转换:ol.proj.transform(coordinate,srcCRS,targetCRS)。

3.4 几何实体:ol.geom。

目标:点、线、面等几何实体类。

方法:

3.4.1坐标对:ol.coordinate、ol.Coordinate。

目标:坐标对操作。

方法:add(),rotate(),toStringXY()等。

坐标样式函数:createStringXY(小数位数)。将一个坐标对转换为String的函数。

显示为度分秒格式:ol.coordinate.toStringHDMS(coordinate)。

显示为小数度:ol.coordinate.toStringXY(coordinate)。

3.4.2坐标样式:ol.CoordinateFormatType()

函数对象,接受一个ol.coordinate参数,并转换为String对象。

参见:坐标对:ol.coordinate、ol.Coordinate。

3.4.3范围:ol.extent,ol.Extent。

目标:表示四角坐标。

方法:扩展,范围,包括等操作。

3.4.4几何体:ol.geom,包括点、线、面、圆等。

3.4.4.1  基类:ol.geom.Geometry:所有几何体的基类。方法:最近点,范围等。

3.4.4.2  线:LineString。

长度:getLength(),直接计算两点间线段的长度。

参考:\ol\geom\flat\lengthflatgeom.js

最后点坐标:getLastCoordinate()。

3.4.4.3  面:polygon

边线:getLineRing(n)。

面积:getArea()。

3.5 切片策略:ol.tilegrid。

目标:切片策略。

方法:

创建策略:createXYZ()。

3.6 数据源:ol.source。

目标:构建各种不同服务的数据源请求。

方法:

3.6.1ol.source.OSM:openstreetmap的瓦片服务。

跨域特性:crossOrigin,默认是anonymous(匿名,无须授权)。还可以使用use-credentials(使用授权)。

参考:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-crossorigin

https://developer.mozilla.org/zh-CN/docs/Web/HTML/CORS_enabled_image

3.6.2ol.source.MapQuest:mapquest网站的服务。可以设置其类型为sat,osm或者hyb。

3.6.3ol.source.TileDebug:目标是调试Tile,生成Tile的网格。

示例:

                     newol.layer.Tile({

                        source: new ol.source.TileDebug({

                              projection: ‘EPSG:3857’,

                        tileGrid:ol.tilegrid.createXYZ({maxZoom: 22})})

3.6.4ol.source.TileImage:目标是Tile类的基类。

3.6.5ol.source.Vector

目标:矢量地图数据源。

方法:

加载元素函数:当地图窗口变化时,将触发加载函数。

loader:function(extent,resolution,projection)。

在此函数中组织URL,然后请求WFS。返回后使用回调函数加载元素就可以显示了。

添加元素:单个元素:addFeature(feature);多个元素addFeatures(feature数组)。

加载策略:strategy,目标是从数据源请求矢量的方式,包括单次请求全部元素(ol.loadingstrategy.all,默认),当前视图范围(ol.loadingstrategy.bbox)或切片范围(lo.loadingststrategy.tile)。

全图范围:getExtent()。

3.7 球体:ol.Sphere

目标:正球体模型。

方法:

3.7.1计算球面大面距离:haversineDistance()半正矢公式。

使用经纬度测量较为精确的球面距离。

半正矢公式:haversine formula,halfof versed sine,球面弦和夹角的关系公式。

参考:http://baike.baidu.com/view/3151325.htm

https://en.wikipedia.org/wiki/Haversine_formula

3.7.2计算球面面积:geodesicArea()。

4 交互相关

4.1 控件:ol.control。

默认控件:ol.control.defauts。包括缩放、旋转、属性,可以配置。

4.1.1鼠标坐标控件:ol.control.MousePosition

目标:获取当前鼠标的坐标位置。

方法:

样式:className,css类名,默认为ol-mouse-position。默认显示在view的右上角。

坐标格式:coordinateFormat。

坐标系统:projection。

目标HTML组件:target。默认为view。

无数据时内容:undefinedHTML。默认为空。

4.2 交互工具:ol.interactions

目标:提供与ol.Map进行交互的鼠标、键盘等工具。

方法:

4.2.1默认工具:ol.interactions.defaults

目标:常用工具,包括缩放、旋转、二指缩放(触摸屏)等。可以配置开关。

4.2.2绘制工具:ol.interactions.Draw。

生成的图形结果数组:features。

数据源:图形绘制的目标。

snap容限:snapTolerance。

几何类型:type。

点数限制:maxPoints,minPoints。

绘制样式:style。

自定义几何生成方法:geometryFunction。

名称:geometryName,用于生成feature。

绘制圆形:createRegularPolygon(),绘制模拟圆形,需指定边数和起点位置。

4.2.3几何生成函数:DrawGeometryFunctionType

目标:生成几何实体。

方法:接受coordinate数组和geometry对象作为参数,返回新的geometry。

4.3 临时图层:ol.Overlay

目标:以地理坐标覆盖在地图表面的临时图层,其中可以加入临时元素。

方法:ol.Overlay

显示:在map上添加Overlay对象。

与目标点的偏移:offset,表示Overlay距离目标点的像素数(如果不设置,则不偏移。不偏移时无法点击到地图)。

Overlay的坐标位置:positioning,可以是左下,右下,中心等。

坐标:setPosition(),如果传入undefined参数,则隐藏。

容器:element。

与地图联动:autoPan,在使用setPosition()或Overlay超过地图范围时,map随之pan,使之随时处于视野之中。

平移动画:autoPanAnimation。

4.4 动画:olx.animation

各种动画效果。

4.4.1平移:panOptions

延迟:duration,单位ms,默认1000。

转载自:https://blog.csdn.net/sf2gis2/article/details/46702735

You may also like...