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。