OpenLayers 3 之 地图图层数据来源(ol.source)详解
source 是 Layer 的重要组成部分,表示图层的来源,也就是服务地址。除了在构造函数中制定外,可以使用 layer.setSource(source) 稍后指定。
一、包含的类型
ol.source.BingMaps ,必应地图的切片数据,继承自ol.source.TileImage;
ol.source.Cluster,聚簇矢量数据,继承自ol.source.Vector;
ol.source.ImageCanvas,数据来源是一个 canvas 元素,其中的数据是图片,继承自 ol.source.Image;
ol.source.ImageMapGuide,Mapguide 服务器提供的图片地图数据,继承自 ol.source.Image,fire ol.source.ImageEvent;
ol.source.ImageStatic,提供单一的静态图片地图,继承自ol.source.Image;
ol.source.ImageVector,数据来源是一个 canvas 元素,但是其中的数据是矢量来源 ol.source.Vector,继承自 ol.source.ImageCanvas;
ol.source.ImageWMS,WMS 服务提供的单一的图片数据,继承自 ol.source.Image,触发 ol.source.ImageEvent;
ol.source.MapQuest,MapQuest 提供的切片数据,继承自 ol.source.XYZ;
ol.source.OSM,OpenStreetMap 提供的切片数据,继承自 ol.source.XYZ;
ol.source.Stamen,Stamen 提供的地图切片数据,继承自 ol.source.XYZ;
ol.source.TileVector,被切分为网格的矢量数据,继承自 ol.source.Vector;
ol.source.TileDebug,并不从服务器获取数据,而是为切片渲染一个网格,继承自 ol.source.Tile;
ol.source.TileImage,提供切分成切片的图片数据,继承自 ol.source.Tile,触发 ol.source.TileEvent;
ol.source.TileUTFGrid,TileJSON 格式 的 UTFGrid 交互数据,继承自 ol.source.Tile;
ol.source.TileJSON,TileJSON 格式的切片数据,继承自 ol.source.TileImage;
ol.source.TileArcGISRest,ArcGIS Rest 服务提供的切片数据,继承自 ol.source.TileImage;
ol.source.WMTS,WMTS 服务提供的切片数据。继承自 ol.source.TileImage;
ol.source.XYZ,XYZ 格式的切片数据,继承自 ol.source.TileImage;
ol.source.Zoomify,Zoomify 格式的切片数据,继承自 ol.source.TileImage。
上面介绍的都是可以实例化的类,还有一部分基类,不能被实例化,只负责被继承,有:
ol.source.Image,提供单一图片数据的类型,直接继承自 ol.source.Source;
ol.source.Tile,提供被切分为网格切片的图片数据,继承自 ol.source.Source;
ol.source.Vector,提供矢量图层数据,继承自 ol.source.Source;
二、用法说明
1. ol.source.Vector
矢量图层的数据来源
1.1 事件
包含四个事件,addfeature,changefeature,clear,removefeature。
addfeature,当一个要素添加到 source 中触发;
changefeature,当要素变化时触发;
clear,当 source 的 clear 方法调用时候触发;
removefeature,当要素移除时候发生。
1.2 参数
接受的参数:
/**
* @typedef {{attributions: (Array.<ol.Attribution>|undefined),
* features: (Array.<ol.Feature>|undefined),
* format: (ol.format.Feature|undefined),
* loader: (ol.FeatureLoader|undefined),
* logo: (string|olx.LogoOptions|undefined),
* strategy: (ol.LoadingStrategy|undefined),
* url: (string|undefined),
* wrapX: (boolean|undefined)}}
* @api
*/
attribution,地图右下角的 logo 包含的内容;
features,地理要素,从字符串读取的数据;
format,url属性设置后,加载要素使用的数据格式,采用异步的 AJAX 加载;
loader,加载要素使用的加载函数;
logo,logo包含的内容;
strategy,加载要素使用的策略,默认是 一次性加载所有要素;
url,要素数据的地址;
wrapX,是否在地图水平坐标轴上重复,默认是 true。
1.3 实例
features 方法
假如有一个包含空间数据的字符串,geojsonObject,是GeoJSON字符串格式,那么可以用来初始化一个图层。
var vectorSource = new ol.source.Vector({
features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
});
var vectorLayer = new ol.layer.Vector({
source: vectorSource,
style: style
});
map.addLayer(vectorLayer);
url + format 方法
如果有一个文件作为数据源,那么可以配置 url 属性来加载数据:
var vectorLayer = new ol.layer.Vector({
source: new ol.source.Vector({
url: 'data/geojson/countries.geojson',
format: new ol.format.GeoJSON()
})
});
这两种方法中都会指定数据来源格式, 矢量数据源支持的格式包含很多:gml、EsriJSON、geojson、gpx、igc、kml、osmxml、ows、polyline、topojson、wfs、wkt、wms capabilities(兼容 wms 的格式)、 wms getfeatureinfo、 wmts capabilities、xlink、xsd等格式。这些格式都有readFeatures 、readFeature 和readGeometry 方法用于读取数据。
2. ol.source.Tile
提供被切分为切片的图片地图数据
可配置的选项
/**
* @typedef {{attributions: (Array.<ol.Attribution>|undefined),
* extent: (ol.Extent|undefined),
* logo: (string|olx.LogoOptions|undefined),
* opaque: (boolean|undefined),
* tilePixelRatio: (number|undefined),
* projection: ol.proj.ProjectionLike,
* state: (ol.source.State|undefined),
* tileGrid: (ol.tilegrid.TileGrid|undefined),
* wrapX: (boolean|undefined)}}
*/
与 vector 一样的选项就不介绍了,介绍与 vector 特有的选项:
extent,地图视图默认的坐标范围;
opaque,不透明与否,一个布尔值,默认 false;
tilePixelRatio,切片的大小调整选项,如 256 × 256,和 512 × 512;
projection,投影;
state,地图所处的状态,包括undefined,loading,ready,error;
tileGrid,覆盖在地图上的格网;
接受的事件
tileloadstart,切片开始加载时触发的事件;
tileloadend,切片加载完毕触发事件;
tileloaderror,切片加载出错时的处理。
3. ol.source.Image
提供单一的图片地图。
可以配置的选项
/**
* @typedef {{attributions: (Array.<ol.Attribution>|undefined),
* extent: (null|ol.Extent|undefined),
* logo: (string|olx.LogoOptions|undefined),
* projection: ol.proj.ProjectionLike,
* resolutions: (Array.<number>|undefined),
* state: (ol.source.State|undefined)}}
*/
resolutions,地图分辨率。其他的选项都与以上的一样。
触发的事件
imageloadstart,图片地图开始加载触发的事件;
imageloadend,图片地图加载完毕触发的事件;
imageloaderror,图片地图加载出错时触发的事件。
四、总结
source 是 layer 中必须的选项,定义着地图数据的来源,与数据有关的函数,如addfeature、getfeature等函数都定义在 source 中,而且数据源支持多种格式。
OpenLayers 3 之 地图图层数据来源(ol.source)详解的更多相关文章
- Code First开发系列之管理数据库创建,填充种子数据以及LINQ操作详解
返回<8天掌握EF的Code First开发>总目录 本篇目录 管理数据库创建 管理数据库连接 管理数据库初始化 填充种子数据 LINQ to Entities详解 什么是LINQ to ...
- 8天掌握EF的Code First开发系列之3 管理数据库创建,填充种子数据以及LINQ操作详解
本文出自8天掌握EF的Code First开发系列,经过自己的实践整理出来. 本篇目录 管理数据库创建 管理数据库连接 管理数据库初始化 填充种子数据 LINQ to Entities详解 什么是LI ...
- <转>ASP.NET学习笔记之MVC 3 数据验证 Model Validation 详解
MVC 3 数据验证 Model Validation 详解 再附加一些比较好的验证详解:(以下均为引用) 1.asp.net mvc3 的数据验证(一) - zhangkai2237 - 博客园 ...
- [转帖]IP /TCP协议及握手过程和数据包格式中级详解
IP /TCP协议及握手过程和数据包格式中级详解 https://www.toutiao.com/a6665292902458982926/ 写的挺好的 其实 一直没闹明白 网络好 广播地址 还有 网 ...
- 转:WCF传送二进制流数据基本实现步骤详解
来自:http://developer.51cto.com/art/201002/185444.htm WCF传送二进制流数据基本实现步骤详解 2010-02-26 16:10 佚名 CSDN W ...
- Oracle10g数据泵impdp参数详解--摘自网络
Oracle10g数据泵impdp参数详解 2011-6-30 12:29:05 导入命令Impdp • ATTACH 连接到现有作业, 例如 ATTACH [=作业名]. • C ...
- python数据分析数据标准化及离散化详解
python数据分析数据标准化及离散化详解 本文为大家分享了python数据分析数据标准化及离散化的具体内容,供大家参考,具体内容如下 标准化 1.离差标准化 是对原始数据的线性变换,使结果映射到[0 ...
- 【大数据系列】MapReduce详解
MapReduce是hadoop中的一个计算框架,用来处理大数据.所谓大数据处理,即以价值为导向,对大数据加工,挖掘和优化等各种处理. MapReduce擅长处理大数据,这是由MapReduce的设计 ...
- sk_buff封装和解封装网络数据包的过程详解
转自:http://www.2cto.com/os/201502/376226.html 可以说sk_buff结构体是Linux网络协议栈的核心中的核心,几乎所有的操作都是围绕sk_buff这个结构体 ...
随机推荐
- DataGridView显示行号-RowPostPaint
DataGridView控件在显示数据时,我们有时候需要显示行号,以便检索查看方便使用. 但DataGridView默认没有设置显示行号的属性. 此时我们只要在DataGridView的RowPost ...
- 应对Gradle联网问题、长时间卡在resolve dependencies的思路
1.出现这种情况,在首先考虑网络问题,依赖下载不下来尝试shadowsocks,未果. 2.检查防火墙问题,更换host,无法解决. 3.新建Gradle工程,依然卡在resolve dependen ...
- Linux基础二(挂载、关机重启与系统等级)
一.Linux 基础之挂载 1. 挂载和查询 1.1 挂载 什么叫挂载?装系统的时候要给硬盘分区,在 Windows 中要分 C 盘 D 盘 DEF 盘,这个操作我们叫做分配盘符,分配盘符之后我们就可 ...
- MT【180】齐次化+换元
已知实数$a,b$满足$a^2-ab-2b^2=1,$则$a^2+b^2$的取值范围_____ 解答:$\textbf{方法一}$由已知得$(a-2b)(a+b)=1$,设$x=a-2b,y=a+b$ ...
- MT【109】线面角最大时为二面角平面角
解答:如图设C到$\alpha$面的距离为$d_1,C_1$到虚线距离为$d_2$ 所求距离$d=d_1+d_2=|AC|sin\theta+|CC_1|cos\theta=4\sqrt{2}sin\ ...
- Flume自定义Source、Sink和Interceptor(简单功能实现)
1.Event event是flume传输的最小对象,从source获取数据后会先封装成event,然后将event发送到channel,sink从channel拿event消费. event由头he ...
- 安利一个很火的 Github 滤镜项目
安利一个很火的 Github 滤镜项目 园长 1 个月前 简评:通过深度学习,一秒钟让你的照片高大上,这是康奈尔大学和 Adobe 的工程师合作的一个新项目,通过卷积神经网络把图片进行风格迁移.项目已 ...
- 解题:UOJ #46 玄学
题面 二进制分组,修改把区间拆开丢在后面,合并的时候归并最后两块:查询在对应节点上二分答案 #include<cstdio> #include<cstring> #includ ...
- 【leetcode】 Jump Game
Given an array of non-negative integers, you are initially positioned at the first index of the arra ...
- python---django中orm的使用(5)数据库的基本操作(性能相关:select_related,和prefetch_related重点)(以及事务操作)
################################################################## # PUBLIC METHODS THAT ALTER ATTRI ...