SuperMap iClient for OpenLayers
主要介绍 SuperMap iClient for OpenLayers 的入门用法,详细的接口参数请参考 API 页面。
SuperMap iClient for OpenLayers 当前使用的 OpenLayers 版本已全面升级为 OpenLayers 6,同时兼容 OpenLayers 5,API 接口无任何变化,但在引入和模块化开发部分有新的调整。
这里主要介绍最新版本的开发方式,OpenLayers 4 或以下版本的开发方式详见:SuperMap iClient 10i 的开发手册。
准备
获取 OpenLayers 和 SuperMap iClient for OpenLayers
开发时需要引入 OpenLayers 和 SuperMap iClient for OpenLayers。其中,OpenLayers 具体包括 CSS 文件和 JS 文件。你可以通过以下几种方式获取这些文件:
OpenLayers
- 通过 OpenLayers 官网 下载 OpenLayers.zip
- 在 OpenLayers 的 GitHub 上下载
SuperMap iClient for OpenLayers
- 通过 SuperMap iClient JavaScript 官网 下载最新版本
- 在 SuperMap iClient for OpenLayers 的 GitHub 中下载 release 版本
引入
文件方式引入
获取文件后,只需要像普通的 JavaScript 库一样用 <script> 标签引入即可。以下详细介绍如何通过 CDN 在线引入 OpenLayers 文件,以及如何通过在线站点引入 SuperMap iClient for OpenLayers。
注意:在当前版本中,iclient-openlayers.js 已更名为 iclient-ol.js。
新建一个 HTML 文件,在 <head> 标签中引入 OpenLayers CSS 文件和 JS 文件,填入 BootCDN 的托管地址,如下:
引入 iclient-ol CSS 文件和 JS 文件,填入 SuperMap iClient for OpenLayers 在线站点地址:
模块化开发
ES6
开发前需使用 npm 安装依赖,然后通过 ES6 的 import 模块加载语法引入相应的模块。
CommonJS
CommonJS 是基于 Node.js 环境的 JavaScript 模块化规范。开发前需使用 npm 安装依赖,然后通过 require 方法引入相应的模块。
AMD
以下例子利用 RequireJS 库实现,将 ol.js 和 iclient-ol.js 通过 “ 获取 OpenLayers 和 SuperMap iClient for OpenLayers ” 下载后放在与 RequireJS 指定的入口主文件所在目录下。
CMD
以下例子利用 SeaJS 库实现,将 ol.js 和 iclient-ol.js 通过 “ 获取 OpenLayers 和 SuperMap iClient for OpenLayers ” 下载后放在与 SeaJS 指定的入口主文件所在目录下。
打包配置
SuperMap iClient for OpenLayers 使用了 ES6 语法,为了兼容不支持 ES6 语法的浏览器,需要在打包的过程中进行一些配置,包括语法转换的处理。
这里的打包配置是针对于 ES6 和 CommonJS 模块开发,对于 AMD 和 CMD 模块开发的项目,不需要利用打包工具。
这里以 webpack 打包工具为例,由于使用不同的包管理器会导致安装包的结构有所不同,所以下面分别介绍了 npm 和 cnpm 两种配置方式:
若您用 npm install
或者 cnpm install --by=npm
安装的依赖,那么您需要在 webpack.config.js 的配置文件的 module 中加入如下配置项:
若您用 cnpm install
安装的依赖,那么您需要在 webpack.config.js 的配置文件的 module 中加入如下配置项:
创建一幅地图
SuperMap iServer 发布的地图
在准备章节,已经新建了一个 HTML 页面,在页面中继续添加代码以创建地图,如下:
以嵌入 SuperMap iServer 发布的世界地图为例,在 <script> 中添加代码,初始化地图信息:
运行效果
第三方地图
SuperMap iClient for OpenLayers 对多种互联网地图信息进行了封装,例如百度地图、天地图等。以天地图为例,SuperMap iClient for OpenLayers 提供了 tiandituSource,代码如下:
运行效果
为地图设置投影
SuperMap iClient for OpenLayers 通过设置 map 中 view 属性的 projection 参数来支持多投影。例如:
projection 参数除了支持 EPSG code 字符串之外,还支持自定义投影参数。通过 ol.proj.Projection 类设置自定义投影参数,例如:
有关各种投影的参数定义,可参考 https://spatialreference.org;如果已有定义,可搜索并查看其投影参数,例如 EPSG:21418,其投影参数为 https://spatialreference.org/ref/epsg/21418/proj4/。
添加控件
通过向地图添加控件的方式,实现对图层的放大,缩小,图层切换等交互操作,常用的控件包括:
控件 | 类名 | 简介 |
---|---|---|
鹰眼图 | ol.control.OverviewMap | 默认位于地图右下角 |
缩放 | ol.control.Zoom | 默认位于地图左上角 |
比例尺 | ol.control.ScaleLine | 默认位于地图左下角 |
图层切换 | ol.control.LayerSwitcher | 默认位于地图右上角 |
版权 | ol.control.Attribution | 默认位于地图右下角 |
添加控件时,通过实例化控件类得到实例对象,将实例对象传入 addControl() 方法,例如:
比例尺控件:
运行效果
图层切换控件:
运行效果
使用矢量瓦片
矢量瓦片是将矢量数据通过不同的描述文件来组织和定义,在客户端实时解析数据和完成绘制。SuperMap iServer 提供了矢量瓦片图层源,即 ol.source.VectorTileSuperMapRest.optionsFromMapJSON(url,mapJSONObj) 其中:
- url:地图服务地址
- mapJSONObj:地图JSON对象(由 getMapInfor() 方法返回的 JSON 数据格式的地图对象)
使用默认风格的矢量瓦片示例
运行效果
绘制符号与图形
OpenLayers 图形绘制方式主要包括基本绘制,手写绘制,捕捉绘制。几何图形的绘制一般包括点、线、面、圆的绘制。
基本绘制
首先在示例界面上添加几何图形绘制的按钮,并设置其样式,以下代码以绘制点为例。
在本例中,首先在地图容器中加载一个矢量图层绘制层并创建一个绘图控件对象(ol.interaction.Draw),然后通过调用 addInteraction() 方法添加此绘制图形控件,再根据设置的几何图形类型绘制图层。绘制图层的关键代码如下:
运行效果
手写绘制
手写绘制是指按住左键不放随意绘制图形,放手绘制完成。关键代码如下:
运行效果
捕捉绘制
捕捉绘制是指绘制时鼠标进入到一个已经绘制好的点的一定容差范围内,鼠标点会被吸附到那个已经绘制好的点的位置。关键代码如下:
运行效果
面积和距离量算
SuperMap iClient for OpenLayers 支持距离量算和面积量算。
距离量算
距离量算功能的实现步骤:
1.构建服务参数类
量算服务参数类提供服务请求所需的信息,该类提供量算的查询参数封装,提供的参数有 geometry,用来定义量算的几何对象,代码如下:
2.构建服务类并发送请求
量算服务类负责向服务端发送请求,并将查询结果返回。使用服务类需要指定服务 URL 等服务参数,向服务端发送请求信息,然后通过监听服务请求完成事件,从事件服务数据类中获取最终的结果 Result 对象,按照用户需求进行处理,代码如下:
运行效果
面积测量
1.实例化测量服务参数,代码如下:
2.调用测量函数
调用测量函数 ol.supermap.MeasureService.measureArea,展示测量结果,代码如下:
运行效果
地物查询
SuperMap iClient for OpenLayers 支持的地物查询功能主要包括:
- 指定ID查询
- 指定SQL查询
- 矩形范围查询
- 任意几何范围查询
- 距离查询
- 缓冲区查询
- 查询栅格信息
- 查询字段信息
指定ID查询
指定 ID 查询,即在数据集中查询符合指定 ID 的地理空间要素,并在客户端中展示出来。本示例为:在 World 数据服务中查询指定 ID 的要素。
使用接口 ol.supermap.FeatureService 在数据集 “World:Countries” 中查询 ID 为 246 和 247 的地理空间要素。
运行效果
指定SQL查询
指定 SQL 查询,即在指定数据集集合中查找符合 SQL 条件的矢量要素,并在客户端中展示出来。本示例为:在 World 数据服务中查询指定 SMID 的要素。
使用接口 ol.supermap.FeatureService 在数据集 “World:Countries” 中查询 “SMID=247” 的矢量要素。
运行效果
矩形范围查询
矩形范围查询,即在指定数据集集合中查找符合矩形范围的矢量要素,并在客户端中展示出来。本示例为:在 World 数据服务中查询指定矩形范围的要素。
使用接口 ol.supermap.FeatureService 在数据集 “World:Capitals” 中查找符合此矩形范围的矢量要素。
运行效果
任意几何范围查询
几何范围查询,即在指定数据集集合中查找符合几何范围的矢量要素,并在客户端中展示出来。本示例为:在 World 数据服务中查询任意几何范围的要素。
使用接口 ol.supermap.FeatureService 在 “World:Countries” 数据集中采用相交空间查询模式查询符合此几何范围的矢量要素。
运行效果
距离查询
距离查询,即在地图服务中的指定图层中查找符合一定距离的矢量要素,并在客户端中展示出来。本示例为:在 World 地图服务中查询符合距离的矢量要素。
使用接口 ol.supermap.QueryService 在图层 “Capitals@World.1” 中查找距离指定点为10度(地图坐标单位)的矢量要素。
运行效果
缓冲区查询
缓冲区查询,即在数据服务中的指定数据集集合中查找符合缓冲区的矢量要素,并在客户端中展示出来。本示例为:在 World 数据服务中查询指定缓冲区的要素。
使用接口 ol.supermap.FeatureService 在数据集 “World:Capitals” 中查找符合此缓冲区范围距离为10度(地图坐标单位)的矢量要素。
运行效果
查询栅格信息
查询栅格信息,即在指定数据集集合中查找某一地理位置所对应的像素值信息,并在客户端中展示出来。
使用接口 ol.supermap.GridCellInfosService 在数据集“WorldEarth”中查询栅格信息为例,示例代码如下:
运行效果
查询字段信息
查询字段信息,即在指定数据集集合中查找符合查询字段信息的矢量要素,并在客户端中展示出来。本示例为:在 World 数据服务中查询指定字段的要素。
使用接口 ol.supermap.FieldService 在数据集 “continent_T” 中查询字段为 “SmID” 的字段信息。
运行效果
地物编辑
地物编辑,包括对点、线、区等几何图形进行编辑设置,如线型、颜色、线宽等。如果没有自定义设置几何图形的样式,交互控件也会用默认样式进行绘制,绘制完成之后进行提交到 Supermap iServer服务。
运行效果
专题图
地图学中将突出而深入地表示一种或几种要素或现象,即集中表示一个主题内容的地图称为专题地图。在 SuperMap 中,专题图是地图图层的符号化显示,即用各种图形渲染风格(大小,颜色,线型,填充等)来图形化地表现专题要素的某方面特征。专题图可以基于 GIS 客户端的 API 直接制作,也可以通过调用后台的地图服务由 GIS 服务器端制作。由服务器端制作专题图的方式,相对具有更高的性能,出图效率也更高;由客户端制作的专题图,则可以引入最新的前端技术,实现更直观漂亮的展示效果和交互效果。
服务端专题图
服务端专题图是由服务器进行专题图的制作,即客户端向服务器发送专题图参数,如数据集名称、风格等,服务器根据参数制作专题图,返回给客户端,由客户端进行展示。
以点密度专题图为例。
点密度专题图用一定大小、形状相同的点表示现象分布范围、数量特征和分布密度。点的多少和所代表的意义由地图的内容决定。点密度专题图使用点的数目或者密集程度来反映一个区域或范围所对应的专题值,其中一个点代表一定数量,则一个区域内的点的个数乘以点所表示的数量就是此区域对应的专题值。
运行效果
客户端专题图
客户端专题图是根据数据的形状和属性数据,在客户端进行相应计算,通过要素图层或任意图层赋予不同的绘制风格并在客户端进行专题图的展示。
SuperMap iClient for OpenLayers 支持的专题图主要包含:
- 单值专题图
- 分段专题图
- 符号等级专题图
- 标签专题图
- 图表专题图
单值专题图
单值专题图是将专题值相同的要素归为一类,为每一类设定一种渲染风格,如颜色或符号等,专题值相同的要素采用相同的渲染风格,从而用来区分不同的类别。
SuperMap iClient for OpenLayers 实现单值专题图,代码如下:
单值专题图类型以及颜色的配置,代码如下:
运行效果
分段专题图
在分段专题图是指按照某种分段方式被分成多个范围段,要素根据各自的专题值被分配到其中一个范围段中,在同一个范围段中的要素使用相同的颜色,填充,符号等风格进行显示。 分段专题图所基于的专题变量必须为数值型,分段专题图一般用来反映连续分布现象的数量或程度特征,如降水量的分布,土壤侵蚀强度的分布等。
Supermap iClient for OpenLayers 实现分段专题图,主要代码如下:
运行效果
符号等级专题图
符号等级专题图根据各要素的某个数量特征,按照一定的分类方法用一组等级符号表示在地图上,以呈现要素间该数量特征的相对关系。
SuperMap iClient for OpenLayers实现符号等级专题图为例,主要代码如下:
运行效果
标签专题图
地图上的必要的标注是必不可少的,不仅帮助用户更好的区分地物要素,同时也显示了要素的某些重要属性,如行政区划、河流、机关、旅游景点的名称、等高线的高程等。在 SuperMap 中,通过制作标签专题图,用户可以轻松的实现地图标注。
SuperMap iClient for OpenLayers 实现标签专题图,主要代码如下:
运行效果
图表专题图
图表专题图是通过为每个要素或记录绘制统计图来反映其对应的专题值的大小。图表专题图可以基于多个变量,反映多种属性,即可以将多个专题值绘制在一个统计图上。通过统计专题图可以在区域本身与各区域之间形成横向和纵向的对比。多用于具有相关数量特征的地图上,比如表示不同地区多年的粮食产量、GDP、人口等,不同时段客运量、地铁流量等。
在图表专题图中,每个区域都会有一幅表示该区域各专题值的统计图,专题图有多种表现形式,目前提供的类型有:柱状图,折线图,三维柱状图,折线图,点状图,饼图,环装图,三维饼图,玫瑰图,三维玫瑰图,环状图。
SuperMap iClient for OpenLayers 实现图表专题图,主要代码如下:
运行效果
空间分析
空间分析(Spatial Analysis)是基于地理对象的位置和形态特征的空间数据分析技术,其目的在于提取和传输空间信息。SuperMap iClient for OpenLayers 支持的空间分析功能包括:
- 缓冲区分析
- 泰森多边形
- 叠加分析
- 表面分析
- 动态分段
- 点定里程
- 里程定点
- 里程定线
- 插值分析
- 栅格代数运算
- 地形计算
- 核密度分析
缓冲区分析
缓冲区分析(buffer)是根据指定的距离在点、线和多边形实体周围自动建立一定宽度的区域范围的分析方法。例如,在环境治理时,常在污染的河流周围划出一定宽度的范围表示受到污染的区域;又如在飞机场,常根据附近居民的健康需要在周围划分出一定范围的区域作为非居住区等。
下面以长春数据为例,对“团结路”进行半径为10米的圆头缓冲分析,缓冲区分析的接口使用方法如下:
设置缓冲区分析参数、缓冲区通用参数。
设置缓冲区分析服务对象,用于将客户端设置的缓冲区分析服务参数传递给服务端,并接收服务端返回的缓冲区分析结果数据。当向服务端发送请求并且服务端成功返回结果时,用户可对获得的缓冲区分析结果做相应处理。
运行效果
泰森多边形
泰森多边形是荷兰气候学家 A.H.Thiessen 提出的一种根据离散分布的气象站的降雨量来计算平均降雨量的方法,即将所有相邻气象站连成三角形,作这些三角形各边的垂直平分线,于是每个气象站周围的若干垂直平分线便围成一个多边形。用这个多边形内所包含的一个唯一气象站的降雨强度来表示这个多边形区域内的降雨强度,并称这个多边形为泰森多边形。泰森多边形又称为 Voronoi 图,是由一组连接两邻点直线的垂直平分线组成的连续多边形组成。
泰森多边形的特性为:
- 每个泰森多边形内仅含有一个离散点数据;
- 泰森多边形内的点到相应离散点的距离最近;
- 位于泰森多边形边上的点到其两边的离散点的距离相等。
泰森多边形的接口使用方法如下:
- SuperMap.REST.ThiessenAnalystService 泰森多边形分析服务类,该类负责将客户设置的泰森多边形分析参数传递给服务端,并接收服务端返回的分析结果数据;
- 泰森多边形分析结果通过该类支持的事件的监听函数参数获取,参数类型为 {SuperMap.REST.ThiessenAnalystEventArgs};
- 获取的结果数据包括 originResult 、result 两种:
- originResult 为服务端返回的用 JSON 对象表示的泰森多边形分析结果数据;
- result 为服务端返回的类型为 {SuperMap.REST.ThiessenAnalystResult} 的泰森多边形分析结果数据对象。
- 泰森多边形分析的参数支持两种:
- 当参数为 {SuperMap.REST.DatasetThiessenAnalystParameters} 类型时,执行数据集泰森多边形分析;
- 当参数为 {SuperMap.REST.GeometryThiessenAnalystParameters} 类型时,执行几何对象泰森多边形分析。
下面以数据集泰森多边形为例,设置泰森多边形服务对象,用于将客户端设置的泰森多边形服务参数传递给服务端,并接收服务端返回的泰森多边形分析结果数据。
运行效果
叠加分析
叠加分析是 GIS 中的一项非常重要的空间分析功能,是指在统一空间参考系统下,通过对两个数据集进行的一系列集合运算,产生新数据集的过程,其目的是通过对空间数据的加工或分析,提取用户需要的新的空间几何信息。同时,通过叠加分析,还将对数据的各种属性信息进行处理。
目前叠加分析广泛应用于资源管理、城市建设评估、国土管理、农林牧业、统计等领域。叠加分析在各领域中的作用:
- 资源管理主要应用于农业和林业领域,解决农业和林业领域各种资源(如土地、森林、草场等)分布变化、统计等问题;
- 城市建设评估主要应用于分析城市人口、经济、建设等的发展变化,统计变化趋势和变化规律;
- 土地和地籍管理涉及土地使用性质变化、地块轮廓变化、地籍权属关系变化等许多内容,借助 GIS 的叠加分析功能可以高效、高质量地完成这些工作;
- 生态、环境的管理评价用于区域生态规划的评价、环境现状评价、环境影响评价、污染物削减分配的决策支持等;
- 地学研究与应用中的地形分析、流域分析、土地利用研究、经济地理研究、空间统计分析、制图等都可以借助叠加分析来完成;
下面将京津地区的行政区域与临边地区的行政区域进行叠加分析,叠加分析接口使用方法如下所示:
设置叠加分析参数:
设置叠加分析服务对象,用于将客户端设置的叠加分析服务参数传递给服务端,并接收服务端返回的分析结果数据。当向服务端发送请求并且服务端成功返回结果时,用户可对获得的叠加分析结果做相应处理。
运行效果
提取等值线/面
提取等值线和提取等值面。等值线是将相邻的、具有相同值的点连起来的线,常用的等值线有等高线、等深线、等温线、等压线、等降水量线等。等值线的分布反映了栅格表面上值的变化,等值线分布越密集的地方,表示栅格表面值的变化比较剧烈。等值线分布较稀疏的地方,表示栅格表面值的变化较小。通过提取等值线,可以找到高程、温度、降水量等值相同的位置,同时等值线的分布状况也可以反映出变化的陡峭和平缓区。等值面是由相邻的等值线封闭组成的面,等值面的变化可以很直观的表示出相邻等值线之间的变化,诸如高程、降水、温度或大气压力等。通过提取等值面可以获得高程、降水、温度等值相同的地方。
本节将通过从全国平均气温采样点中提取等值线的功能来具体说明表面分析的接口使用。
设置表面分析参数、表面分析提取操作参数。
设置表面分析服务对象,用于将客户端设置的表面分析服务参数传递给服务端, 并接收服务端返回的表面分析结果数据。当向服务端发送请求并且服务端成功返回结果时,用户可对获得的表面分析结果做相应处理。
运行效果
动态分段
动态分段技术是在传统 GIS 数据模型的基础上,利用线性参考技术,实现属性数据在地图上动态地显示、分析及输出等,是 GIS 空间分析中的一个重要技术手段。它不是在线要素沿线上某种属性发生变化的地方进行“物理分段”,而是在传统的 GIS 数据模型的基础上利用线性参考系统的思想及算法,将属性的沿线变化存储为独立的属性表字段(事件属性表);在分析、显示、查询和输出时直接依据事件属性表中的距离值对线性要素进行动态逻辑分段,使用相对位置描述发生在线上的事件,比传统 GIS 要素更容易定位。除此之外,该技术还提高了数据制作效率和数据存储空间利用率,降低了数据维护的复杂度。目前已广泛应用于公共交通管理、路面质量管理、航海线路模拟、通讯网络管理、电网管理等诸多领域。
本专题将以长春市道路的数据为例,根据某一时刻的某些道路出现拥堵和车路段辆较多现象,利用动态分段技术在客户端实时动态显示出道路的路况(拥挤/缓行/畅通),以提示驾驶人员避免进入拥堵路段,选择合适的行驶路线。动态分段接口使用方法如下:
在客户端设置用于向服务端发送的动态分段各参数,包括数据返回选项 DataReturnOption、动态分段参数 generateSpatialDataParams。
定义动态分段服务对象,用于将客户端设置的动态分段分析服务参数( parameters )传递给服务端,并接收服务端返回的动态分段分析结果数据。当向服务端发送请求并且服务端成功返回结果时,用户可在客户端对获得的动态分段空间数据做相应处理,将空间数据中的路况信息以专题图的形式展现给用户。
运行效果
点定里程
点定里程是计算路由上某点到起始点的 M 值,实际应用情景例如知道某事故发生的位置确定该点位于某路口距离。
下面以长春数据为例,计算一条路上(路由ID为1690的路由)发生交通事故的地点到该条路路口的距离。
点定里程接口使用方法如下:
地图加载完成后进行点定里程分析服务,首先根据 RouteID 获得路由对象,路由对象查询成功之后才能进行后续的点定里程操作。
运行效果
里程定点
里程定点是根据指定路由上的 M 值来定位点。应用情景与点定里程相反,如知道某事故距离某路口位置,需要确定其相对精确的坐标的时候使用。
下面以长春数据为例,确定一条发生交通事故的路上(路由ID为1690的路由)与路口距离为10km的事故点,里程定点的接口使用方法:
地图加载完成后进行里程定点分析服务,首先根据 RouteID 获得路由对象,路由对象查询成功之后才能进行后续的里程定点操作。
运行效果
里程定线
里程定线是根据指定线的范围来确定路由上对应的线对象。应用场景如当知道某一路段发生阻塞,能够确定该路段相对精确的位置范围。
下面以长春数据为例,一条路(路由 ID 为1690的路由)在距离路口 10-800km 之间的发生堵塞。
地图加载完成后进行里程定线分析服务,首先根据 RouteID 获得路由对象,路由对象查询成功之后才能进行后续的里程定线操作。里程定线的接口使用方法如下:
运行效果
插值分析
插值分析可以将有限的采样点数据,通过插值对采样点周围的数值情况进行预测,从而掌握研究区域内数据的总体分布状况,而使采样的离散点不仅仅反映其所在位置的数值情况,而且可以反映区域的数值分布。SuperMap 中提供三种插值方法,用于模拟或者创建一个表面,分别是:距离反比权重法(IDW)、克吕金插值方法(Kriging)、径向基函数插值法(RBF)。选用何种方法进行插值分析,通常取决于样点数据的分布和要创建表面的类型。
无论选择哪种插值方法,已知点的数据越多,分布越广,插值结果将越接近实际情况。下面以距离反比权重法为例。
运行效果
栅格代数运算
栅格代数运算是运用代数学的观点对地理特征和现象进行空间分析,即对一个或多个栅格数据进行数学运算和函数运算。同时,运算得出的结果栅格数据的像元值是由一个或多个输入栅格数据的同一位置的像元值通过代数运算得到的。
为了更好的实现栅格代数运算功能,SuperMap 提供了丰富的运算符、函数和运算表达式,除了常用的算术运算(如加、减、乘、除和取整等)方法,还支持通过用户自定义的表达式,来进行栅格的算术运算、条件运算、逻辑运算、函数运算(包括常用函数、三角函数等)和复合运算,用户可以通过栅格代数运算实现多种栅格分析需求。
栅格代数运算接口使用方法如下:
运行效果
地形计算
地形计算又称地形曲率计算,格数据表面的曲率,包括平均曲率、剖面曲率和平面曲率。曲率是表面的二阶导数,或者可称之为坡度的坡度。输出结果为地形栅格每个像元的表面曲率,该值通过将该像元与八个相邻像元拟合而得。结果输出为栅格数据集,可输出曲率类型为:平均曲率、剖面曲率和平面曲率,平均曲率为必须输出的结果,剖面曲率和平面曲率为可选择输出。其中,剖面曲率是指沿最大斜率方向的曲率,平面曲率是指垂直于最大斜率方向的曲率。应用场景如当知道某一路段发生阻塞,能够确定该路段相对精确的位置范围。
设置曲率计算的栅格数据集有以下几个:
- 数据源:列出了当前工作空间中所有的数据源,选择要进行曲率计算的栅格数据集所在的数据源;
- 数据集:列出了当前数据源中所有的栅格数据集,在列表中选择曲率计算栅格数据集。若在工作空间管理器中选中了栅格数据集,则会自动定位到该数据集;
- 高程缩放系数:计算曲率时,要求地形栅格值(即高程值)的单位与 x,y 坐标的单位相同,通常需要将高程值乘以一个高程缩放系数,使得三者单位一致。例如,X、Y 方向上的单位是米,而 Z 方向的单位是英尺,由于 1 英尺等于 0.3048 米,则需要指定缩放系数为 0.3048。如果设置为 1,表示不缩放。
在进行地形计算处理之前,需要先初始化地图。
地图加载完成后进行地形计算分析服务。
运行效果
核密度分析
核密度分析用于计算点、线要素测量值在指定邻域范围内的单位密度。简单来说,它能直观的反映出离散测量值在连续区域内的分布情况。其结果是中间值大周边值小的光滑曲面,栅格值即为单位密度,在邻域边界处降为0。
密度分析可用于计算人口密度、建筑密度、获取犯罪情况报告、旅游区人口密度监测、连锁店经营情况分析等等。例如:
某街区分布了多栋高层公寓及住宅,已知每栋的入住人数,想要了解街区内各处的人口分布情况,即可使用此功能,相当于将每栋楼的人口数量以核函数的变化趋势分布到指定的圆形邻域内,重叠区域进行加和,最后得到街区内各处的人口密度。而人口密度结果可用于店铺选址决策、犯罪率估算等。
在进行核密度分析之前,需要先初始化地图。
地图加载完成后进行核密度分析服务。
运行效果
交通换乘分析
交通换乘分析的使用方法如下:
- 定义起始站点和终点站点名查询函数;
- 进行交通换乘查询,首先需在客户端设置用于向服务端发送的交通换乘参数,其次定义交通换乘服务,用于向服务端发送请求并从服务端获得交通换乘结果数据,最后将返回的结果在客户端进行展示。
下面以长春交通数据模拟的公交线路数据为例,起点为省汽修,终点为中央大厦,范例提供了最少时间的换乘策略,用户可根据自己的需要选择最为合适的出行路线。
1. 交通换乘方案查询
交通方案查询:该方法返回所有的乘车方案,根据方案中的介绍信息可以获取具体的乘车路线。实现过程首先需要设置交通换乘参数,需要设置的参数包括 solutionCount、transferTactic、walkingRatio、points,定义交通换乘服务函数,向服务端发送请求,待服务端成功处理并返回交通换乘结果数据。
2. 乘车路线查询
根据换乘方案查询结果(transferSolutions)得到的乘车方案,获取某一条乘车路线的详细信息。
运行效果:
这里仅展示最少时间查询结果,其中起始站点为省汽修,终点站点为中安大厦,查询效果如下所示:
网络分析
SuperMap iClient for OpenLayers 网络分析功能包括:
- 服务区分析
- 查找最近设施
- 选址分区分析
- 多旅行商分析/物流配送
- 规划最佳路径
服务区分析
服务区分析是为网络上指定的服务中心点查找其服务范围。例如:为网络上某点计算其 30 分钟的服务区,则结果服务区内,任意点出发到该点的时间都不会超过30分钟。
下面以长春数据为例,然后在地图中选择将要分析的服务中心点(支持多中心),根据选择服务中心点的顺序依次按照。 400、500、600...递增的数值作为服务半径进行缓冲区分析。(即第一个服务中心点的服务半径为 400,第二个服务中心店的服务半径为 500,依次类推)。
服务区分析接口使用方法:
设置服务区分析参数 FindServiceAreasParameters,包括网络分析通用参数、途径站点等。
定义服务区分析服务对象,用于将客户端设置的服务区分析服务参数(parameters)传递给服务端, 并接收服务端返回的动态分段分析结果数据。当向服务端发送请求并且服务端成功返回结果时,用户可对获得的服务区分析结果做相应处理。
运行效果
查找最近设施
最近设施分析是指在网络上给定一个事件点和一组设施点,为事件点查找以最小耗费能到达的一个或几个设施点,结果显示从事件点到设施点(或从设施点到事件点)的最佳路径,耗费,及行驶方向。例如事件发生点是一起交通事故,要求查找在10分钟内能到达的最近医院,超过10分钟能到达的都不予考虑。此例中,事故发生地即是一个事件点,周边的医院则是设施点。最近设施查找实际上也是一种路径分析,因此,同样可以应用障碍边和障碍点的设置,在行驶路途上这些障碍将不能被穿越,在路径分析中会予以考虑。
下面以长春数据为例,在地图上标记事故事件点,然后针对三个医院进行最近设施查找分析,其接口使用方法如下所示:
设置最近设施分析参数,包括网络分析通用参数、事件点、设施点、查找半径等。
定义最近设施查找分析对象,用于将客户端设置的最近设施查找分析服务参数传递给服务端,并接收服务端返回的最近设施分析结果。当向服务端发送请求并且服务端成功返回结果时,用户可对获得的最近设施分析结果做相应处理。
运行效果
选址分区分析
选址分区分析是为了确定一个或多个待建设施的最佳或最优位置,使得设施可以用一种最经济有效的方式为需求方提供服务或者商品。选址分区不仅仅是一个选址过程,还要将需求点的需求分配到相应的新建设施的服务区中,因此称之为选址与分区。
设置选址分区分析参数,包括交通网络分析通用参数、途径站点等。
定义选址分区分析服务对象,用于将客户端设置的选址分区分析服务参数传递给服务端,并接收服务端返回的动态分段分析结果数据。当向服务端发送请求并且服务端成功返回结果时,用户可对获得的选址分区分析结果做相应处理。
运行效果
多旅行商分析/物流配送
多旅行商分析也称为物流配送,是指在网络数据集中,给定M个配送中心点和N个配送目的地(M,N为大于零的整数),查找经济有效的配送路径,并给出相应的行走路线。多旅行商分析功能就是解决如何合理分配配送次序和送货路线,使配送总花费达到最小或每个配送中心的花费达到最小。
多旅行商分析的结果将给出,每个配送中心所负责的配送目的地,并且在某个配送中心向其负责的配送目的地配送货物的时候,又给出经过各个配送目的地的顺序,和相应的行走路线,从而使该配送中心的配送花费最少,或者使得所有的配送中心的总花费最小。
下面以长春数据为例,利用多旅行商分析和旅行商分析对食品厂各个仓库配送中心到用户指定的零售站的配送路线进行分析,并且给出质检员定期到各个零售站检查货品情况时所走的花费最小的路线,其接口使用方法如下所示:
设置多旅行商分析参数 findMTSPPathsParams,包括交通网络分析通用参数、配送中心点集合、配送目标点集合、配送模式等。
通过向服务端提交物流配送分析的请求参数,待服务端成功处理并返回分析处理结果后对其进行解析,获得由配送中心依次向各个配送目的地配送货物的最佳路径。
运行效果
规划最佳路径
最佳路径,是求解网络中两点之间阻抗最小的路经,必须按照结点的选择顺序访问网络中的结点。“阻抗最小”有多种理解,如基于单因素考虑的时间最短、费用最低、风景最好、路况最佳、过桥最少、收费站最少、经过乡村最多等。
下面以长春数据为例,计算地图中将要行走的地点间的最佳路径。其接口使用方法如下:
设置最佳路径分析参数 findPathParameter,包括交通网络分析通用参数、途径站点等;
向服务端提交最佳路径分析的请求,待服务端成功处理并返回最佳路径分析结果 serviceResult 对其进行解析,将行驶路线在地图中展现出来并给出行驶导引信息。
运行效果
客户端计算
SuperMap iClient for OpenLayers 提供 Turf.js 分析接口,以支持客户端计算。
Turf.js 是一个用于空间分析的 JavaScript 库。它包括传统的空间操作,用于创建 GeoJSON 数据的帮助函数,以及数据分类和统计工具。 Turf.js 可以作为客户端插件添加到您的网站,也可以使用 Node.js 运行 Turf 服务器。
Turf.js 使用 GeoJSON 来处理所有地理数据。Turf.js 的数据标准是 WGS84 经度、纬度坐标,使用 geojson.io 这个工具轻松创建此数据。
大多数 Turf.js 函数使用 GeoJSON 功能。这些是表示属性集合(即:人口,高程,邮政编码等)以及几何的数据片段。 GeoJSON 有几种几何类型,如:
- Point
- LineString
- Polygon
以Turf格网分析为例,关键代码如下:
运行效果
地址匹配
SuperMap iClient for OpenLayers 支持地址匹配服务。地址匹配服务包含正向匹配与反向匹配两种方式,即,用户可通过地点名称找到地址位置,也可以找到指定位置上的地点。
正向地址匹配
正向地址匹配根据地点描述、城市范围返回对应的地理坐标和结构化的地址详细描述,支持中文模糊匹配。
运行效果
反向地址匹配
反向地址匹配通过输入地址坐标来获取对应的规范化的地址描述。
运行效果
大数据分析
SuperMap iClient for OpenLayers 对接了 SuperMap iServer 的分布式分析服务,为用户提供大数据分析功能,主要包括:
- 密度分析
- 点聚合分析
- 单对象查询分析
- 区域汇总分析
- 矢量剪裁分析
密度分析
SuperMap iServer 的分布式分析服务中的密度分析包括简单点密度分析和核密度分析两种:
- 简单点密度分析:用于计算每个点的指定邻域形状内的每单位面积量值。计算方法为点的测量值除以指定邻域面积,点的邻域叠加处,其密度值也相加,每个输出栅格的密度均为叠加在栅格上的所有邻域密度值之和。结果栅格值的单位为原数据集单位的平方的倒数,即若原数据集单位为米,则结果栅格值的单位为每平方米;
- 核密度分析:用于计算点、线要素测量值在指定邻域范围内的单位密度。简单来说,它能直观的反映出离散测量值在连续区域内的分布情况。其结果是中间值大周边值小的光滑曲面,栅格值即为单位密度,在邻域边界处降为0。核密度分析可用于计算人口密度、建筑密度、获取犯罪情况报告、旅游区人口密度监测、连锁店经营情况分析等等。
下面对大数据进行简单点密度分析,网格面类型为四边形网格。其接口使用方法如下:
设置密度分析参数 kernelDensityJobParam,包括数据集、分析方法、分析类型、格网大小等。
向服务端提交密度分析的请求,待服务端成功处理并返回密度分析结果后对其进行解析处理。
运行效果
点聚合分析
点聚合分析,是指针对点数据集制作聚合图的一种空间分析作业。通过网格面或多边形对地图点要素进行划分,然后计算每个面对象内点要素的数量,并作为面对象的统计值,也可以引入点的权重信息,考虑面对象内点的加权值作为面对象的统计值;最后基于面对象的统计值,按照统计值大小排序的结果,通过色带对面对象进行色彩填充。
目前支持的点聚合分析类型包括:网格面聚合和多边形聚合,其中网格面聚合图按照网格类型又可分为四边形网格和六边形网格。
下面进行点聚合分析,其中聚合类型为网格面聚合,网格面类型为四边形网格。其接口使用方法如下:
设置点聚合分析参数 summaryMeshJobParam,包括数据集、聚合类型、统计模式、格网大小等。
向服务端提交点聚合分析的请求,待服务端成功处理并返回点聚合分析结果后对其进行解析处理。
运行效果
单对象查询分析
空间查询是通过几何对象之间的空间位置关系来构建过滤条件的一种查询方式。例如:通过空间查询可以找到被包含在面中的空间对象,相离或者相邻的空间对象等。
SuperMap iServer 的分布式分析服务中的单对象空间查询,是指只支持查询对象数据集中的一个对象对被查询数据集做空间查询。如果查询对象数据集中有多个对象,则默认用 SmID 最小的对象对被查询数据集做空间查询。
下面进行单对象空间查询分析,其中空间查询模式使用“相交”。其接口使用方法如下:
设置单对象空间查询分析参数 singleObjectQueryJobsParam,包括源数据集、查询对象数据集、空间查询模式。
向服务端提交单对象查询分析的请求,待服务端成功处理并返回单对象查询分析结果后对其进行解析处理。
运行效果
区域汇总分析
区域汇总分析,是指针对线数据集和面数据集制作聚合图的一种空间分析作业。指通过网格面或多边形对地图线或面要素进行划分,然后,以标准属性字段或权重字段对每个网格单元内线或面要素进行统计,将统计结果作为该网格单元的统计值。最后按照网格单元统计值的大小进行排序,通过色带对网格单元进行色彩填充。
区域汇总分析的概念与点聚合分析的概念类似,不同的是点聚合分析是对点数据集进行统计计算,而区域汇总分析是对线数据集和面数据集进行统计计算。在区域汇总分析的概念里,网格单元的统计值有两种统计方式,以标准属性字段统计和以权重字段统计。
下面进行区域汇总分析,其中汇总类型为网格面汇总,网格面类型为四边形网格。其接口使用方法如下:
设置区域汇总分析参数 summaryRegionJobParam,包括数据集、汇总类型、网格面汇总类型等。
向服务端提交区域汇总分析的请求,待服务端成功处理并返回区域汇总分析结果后对其进行解析处理。
运行效果
矢量裁剪分析
矢量裁剪分析为对矢量数据集进行裁剪。包括内部裁剪和外部裁剪。内部裁剪指被裁剪的矢量数据集在裁剪区范围内的部分被保留到结果数据集中;相反,使用外部裁剪,则保留不在裁剪区范围内的那部分数据到结果数据集中。
SuperMap iServer 的分布式分析服务中的矢量裁剪分析,只支持裁剪对象数据集中的一个对象对源数据集做矢量裁剪。如果裁剪数据集中有多个对象,则默认用 SmID 最小的对象对源数据集做矢量裁剪。
下面进行矢量裁剪分析,裁剪矢量分析模式使用内部裁剪。其接口使用方法如下:
设置矢量裁剪分析参数 vectorClipJobsParam,包括源数据、裁剪对象数据集、裁剪分析模式。
向服务端提交矢量裁剪分析的请求,待服务端成功处理并返回矢量裁剪分析结果后对其进行解析处理。
运行效果
数据流
SuperMap iServer 提供数据流服务,使客户端与服务器之间实现低延迟和实时数据传输。数据流服务采用 WebSocket 协议,支持全双工、双向式通信。服务器可将实时数据服务的分析处理结果作为数据来源向客户端广播,客户端与数据流服务建立连接后,即可自动接收服务器广播的数据。
查询一个线数据,每两秒将一个点通过 dataFlowService 广播给 iSevrer 的 dataflow 服务,模拟实时数据, 可通过 dataFlowService 将其他实时数据广播给 iServer。
通过间隔2s的定时器对 broadcast 函数进行连续调用,通过 count 的自增来模拟实时的坐标位置的变化,产生实时数据的效果。
运行效果
数据可视化
SuperMap iClient for OpenLayers支持可视化包含:
热力图
原理:在客户端直接渲染的栅格图,热点图的渲染需要三大要素:
- 热点数据,热点数据需要点数据,每一个热点数据需要有地理位置以及权重值 (能够明显的表现某位置某事件发生频率或事物分布密度等,如可以为温度的高低、人口密集度等等)
- 热点衰减渐变填充色集合, 用于渲染每一个热点从中心向外衰减时的渐变色
- 热点半径,也就是衰减半径。每一个热点需要从中心点外四周根据半径计算衰减度, 对在热点衰减区内的每一个像素计算需要渲染的颜色值,然后进行客户端渲染
应用场景:由于热点图的衰减是像素级别的,视觉效果方面极佳,但不能与具体数据进行一一对应,只能表示权重之间的差别,所以可以用于一些对精度要求不高而需要重点突出权重渐变的行业,如可以制作气象温度对比动态效果图、地震区域的震点强弱图等。
示例代码
运行效果
聚点图
AnimatedCluster 是一个提供动态标识聚类功能的 OpenLayers 插件。
下载 AnimatedCluster 插件
1.进入 github 下载 AnimatedCluster,下载地址为:
2.script标签引入:
示例代码:
根据要素的长度来确定绘制聚点的样式。
运行效果
动画要素图
基于 OpenLayers 的动态闪烁点的动画示例。
示例代码:
运行效果
高效率点图层
高效率点图层(graphicLayer),主要是针对前端大数据量的点渲染。
创建 graphicLayer,在地图上随机绘制10万圆形:
运行效果
ECharts
ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari 等),底层依赖轻量级的矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。
ECharts 提供了常规的折线图、柱状图、散点图、饼图、K线图,用于统计的盒形图,用于地理数据可视化的地图、热力图、线图,用于关系数据可视化的关系图、treemap、旭日图,多维数据可视化的平行坐标,还有用于 BI 的漏斗图,仪表盘,并且支持图与图之间的混搭。
ECharts 官网地址为:
SuperMap iClient for OpenLayers 提供了ol3Echarts插件以支持ECharts的可视化效果,以北京公交路特效图为例:
创建 echartslayer 图层,并添加到地图:
配置 echartslayer 图层属性,传入图层进行渲染:
运行效果
Mapv
Mapv 是一款地理信息可视化开源库,可以用来展示大量地理信息数据,点、线、面的数据,每种数据也有不同的展示类型,如直接打点、热力图、网格、聚合等方式展示数据。
MapV 可展示大量的点数据,形式可以为热力图、网格、蜂窝状、点聚合、按颜色区间、按半径大小等。可展示大量的线数据,如普通画线、高亮叠加、热力线数据展示等方式,还有各种动画效果,适合用于呈现大量轨迹的场景。也可展示大量的自定义面数据,按颜色区间来展示,行政区域也是其中一种应用场景,可直接使用。
MapV 官网地址为:
SuperMap iClient for OpenLayers 提供了 ol.source.Mapv 以对可视化效果图层进行支持
下面以 MapV 强边界图为例,将数据进行可视化的展示:
配置样式参数对象
运行效果
OSM Buildings
OSM Buildings 是一个在二维地图上构建和展示 2.5D 建筑效果的可视化库。
OSM Buildings 支持 GeoJSON 数据格式。
引入插件 OSMBuildings.js 包括两种方式:
下载 OSMBuildings.js
1.进入 github 下载 OSMBuildings.js,下载地址为:
2.<script>标签引入:
直接通过 cdn 引入
核心代码
运行效果