OpenLayers 3对OpenLayers网络地图库进行了根本的重新设计。版本2虽然被广泛使用,但从JavaScript开发的早期发展阶段开始,已日益现实出它的落后。 OL3已运用现代的设计模式从底层重写。OpenLayers 3同时设计了一些主要的新功能,如显示三维地图,或使用WebGL快速显示大型矢量数据集,这些功能将在以后的版本中加入。
1、Map
OpenLayers 3的核心部件是Map(ol.Map)。它被呈现到对象target容器(例如,包含在地图的网页上的div元素)。所有地图的属性可以在构造时进行配置,或者通过使用setter方法,如setTarget()。
2、View
ol. View负责地图的中心点,放大,投影之类的设置。
一个ol.View实例包含投影projection,该投影决定中心center 的坐标系以及分辨率的单位,如果没有指定(如下面的代码段),默认的投影是球墨卡托(EPSG:3857),以米为地图单位。
放大zoom 选项是一种方便的方式来指定地图的分辨率,可用的缩放级别由maxZoom (默认值为28)、zoomFactor (默认值为2)、maxResolution (默认由投影在256×256像素瓦片的有效成都来计算) 决定。起始于缩放级别0,以每像素maxResolution 的单位为分辨率,后续的缩放级别是通过zoomFactor区分之前的缩放级别的分辨率来计算的,直到缩放级别达到maxZoom 。
3、Source
OpenLayers 3使用ol.source.Source子类获取远程数据图层,包含免费的和商业的地图瓦片服务,如OpenStreetMap、Bing、OGC资源(WMS或WMTS)、矢量数据(GeoJSON格式、KML格式…)等。
4、Layer
一个图层是资源中数据的可视化显示,OpenLayers 3包含三种基本图层类型:ol.layer.Tile、ol.layer.Image 和 ol.layer.Vector。
ol.layer.Tile用于显示瓦片资源,这些瓦片提供了预渲染,并且由特定分别率的缩放级别组织的瓦片图片网格组成。
ol.layer.Image用于显示支持渲染服务的图片,这些图片可用于任意范围和分辨率。
ol.layer.Vector用于显示在客户端渲染的矢量数据。
5、Control
它为用户提供了和地图交互的入口。 针对不同的用途,具有不同的控件。其实现类都放在包ol.control下面,在此之前还没有具体接触过,但我们在地图上看到的放大缩小按钮就是众多控件中的一种。控件具备相同的一个特性,就是一直保持在地图的某个固定位置,不会随着地图移动而移动,也不会随着地图放大缩小而变化,一直处于地图的最上层。
controldefaults,地图默认包含的控件,包含缩放控件和旋转控件;
fullscreencontrol,全屏控件,用于全屏幕查看地图;
mousepositioncontrol,鼠标位置控件,显示鼠标所在地图位置的坐标,可以自定义投影;
overviewmapcontrol,地图全局视图控件;
rotatecontrol,地图旋转控件;
scalelinecontrol,比例尺控件;
zoomcontrol,缩放控件;
zoomslidercontrol,缩放刻度控件;
zoomtoextentcontrol,缩放到全局控件。
6、Interaction
这是所有软件都具备的一个组成部分,直观地是看不见的,其实现类放在包ol.interaction下面,之前也没具体接触过,但其实是使用到了,如果没有它,我们就没有办法直接用鼠标控制地图放大、缩小、移动。这并不仅仅存在于GIS引擎中,它存在于任何产品中。任何优秀的产品必然有着良好的交互能力,即使没有任何GIS知识,也能体会到它的作用和重要性
doubleclickzoom interaction,双击放大交互功能;
draganddrop interaction,以“拖文件到地图中”的交互添加图层;
dragbox interaction,拉框,用于划定一个矩形范围,常用于放大地图;
dragpan interaction,拖拽平移地图;
dragrotateandzoom interaction,拖拽方式进行缩放和旋转地图;
dragrotate interaction,拖拽方式旋转地图;
dragzoom interaction,拖拽方式缩放地图;
draw interaction,绘制地理要素功能;
interaction defaults ,规定了默认添加的交互功能;
keyboardpan interaction,键盘方式平移地图;
keyboardzoom interaction,键盘方式缩放地图;
select interaction,选择要素功能;
modify interaction,更改要素;
mousewheelzoom interaction,鼠标滚轮缩放功能;
pinchrotate interaction,手指旋转地图,针对触摸屏;
pinchzoom interaction,手指进行缩放,针对触摸屏;
pointer interaction,鼠标的用户自定义事件基类;
snap interaction,鼠标捕捉,当鼠标距离某个要素一定距离之内,自动吸附到要素。
以上就是一个OpenLayer 3地图所有核心的组成部分, 他们有机的组合在一起,从而构成整个地图,实现了我们对地图的完整需要。 OpenLayer 3采用这样的模块化设计,不管是在实现上,还是对外提供API,都简化了整个系统。我们只要完整地了解每一个组成部分,就能游刃有余地运用它。在这些组成部分中,只有Layer和Source有直接的强联系,其他的组成部分,相互之间的联系很少。为此,在掌握某一部分后,就可以有效地处理这一部分的开发工作,从而不一定要掌握所有组成部分。
喜欢的小伙伴可以点个赞,等把openlayer相关文章写完会抽几个小伙伴送出openlayer相关的视频教程。