一种通用型WebGIS开发客户端的构建方法及其使用方法

摘要

本申请公开了一种通用型WebGIS开发客户端的构建方法及其使用方法，其中，通用型WebGIS开发客户端的构建方法包括如下步骤：S110：提取多种WebGIS客户端的常用功能；S120：根据常用功能提取多种WebGIS客户端的功能接口，构建JavaScript基础类；功能接口至少包括：地图初始化接口、地图操作JS接口，覆盖物接口和OGC图层操作接口；S130：利用JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口，并构建处理后的JavaScript基础类；S140：通过前端打包工具对处理后的JavaScript基础类进行打包，并整合为一个文件，完成整合后将该文件作为通用型WebGIS框架的引入接口；S150：若需要开发新的通用型功能接口，则执行S130‑S140进行继承开发。本申请具有减少人力成本、加快产品交付和增加产品复用性的技术效果。

说明书

技术领域

本申请涉及电子地图技术领域，尤其涉及一种通用型WebGIS开发客户端的构建方法及其使用方法。

背景技术

随着近年来计算机技术的发展，地理信息系统(Geographic InformationSystem，GIS)在城市规划、地下管线管理、市政设施、房地产和交通管理等领域具有越来越重要的应用价值，而基于Internet技术的WebGIS(网络地理信息系统)则是GIS技术发展的新趋势之一。

然而，WebGIS平台种类繁多，主要分为互联网型、商用型及开源型。互联网型GIS主要包含高德地图、百度地图等；商用型GIS包含ArcGIS、SuperMap、MapGIS等；开源型GIS包含GeoServer、MapServer等。对应的WebGIS客户端种类繁多，主要包括：百度API(ApplicationProgramming Interface，应用程序接口)、高德API、ArcGIS API for JavaScript、SuperMapAPI等。进而导致如下问题：

(1)不同的WebGIS平台对应的地图初始化、地图标记以及地图相关操作的接口名称及参数各不相同，而技术人员不可能同时掌握众多WebGIS客户端，同时学习众多WebGIS客户端容易造成不熟练而导致开发效率降低等问题。

(2)因为各个WebGIS客户端的接口名称及参数不同，如果相同的产品更换WebGIS平台，则相关的GIS功能需要重新研发，进而造成人力成本增加，交付周期加长，产品复用性低等问题。

为解决上述问题，亟需在诸多WebGIS平台上研发一种通用的WebGIS客户端。

发明内容

本申请的目的在于提供一种通用型WebGIS开发客户端的构建方法及其使用方法，具有减少人力成本、加快产品交付和增加产品复用性的技术效果。

为达到上述目的，本申请提供一种通用型WebGIS开发客户端的构建方法，包括如下步骤：S110：提取多种WebGIS客户端的常用功能；S120：根据常用功能提取多种WebGIS客户端的功能接口，构建JavaScript基础类；其中，功能接口至少包括：地图初始化接口、地图操作JS接口，覆盖物接口和OGC图层操作接口；S130：利用JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口，并构建处理后的JavaScript基础类；S140：通过前端打包工具对处理后的JavaScript基础类进行打包，并整合为一个文件，完成整合后将该文件作为通用型WebGIS框架的引入接口；S150：若需要开发新的通用型功能接口，则执行S130-S140进行继承开发。

如上的，其中，利用JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口，并构建处理后的JavaScript基础类的子步骤如下：通过参数mapType确定多个WebGIS客户端的引擎类型；根据引擎类型确定接口类型；对每种接口类型的接口参数进行确定，利用接口参数和JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口；利用通用型功能接口构建处理后的JavaScript基础类，并将参数mapType设置为处理后的JavaScript基础类的全局属性。

如上的，其中，通过编码方式利用接口参数和JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口。

如上的，其中，通用型功能接口至少包括：通用型地图初始化接口、通用型地图操作JS接口、通用型覆盖物接口和通用型OGC图层操作接口。

本申请还提供一种通用型WebGIS开发客户端的使用方法，包括如下步骤：通过HTML Script标签引入通过上述的通用型WebGIS开发客户端的构建方法构建的通用型WebGIS框架；调用通用型WebGIS框架中的通用型地图初始化接口完成地图初始化，展示出地图；确定在地图上即将执行的操作，根据即将执行的操作从通用型WebGIS框架中调取相应的通用型功能接口进行使用，其中，即将执行的操作至少包括：地图操作初始化、覆盖物添加和OGC图层操作。

如上的，其中，当在地图上即将执行的操作为地图操作初始化时，调用通用型地图操作JS接口，其中，通用型地图操作JS接口的函数如下：WebGIS.initTools(type,options)；其中，第一个参数type代表地图操作类型；第二个参数options表示地图操作的样式信息JSON对象。

如上的，其中，当在地图上即将执行的操作为覆盖物添加时，调用通用型覆盖物接口，其中，通用型覆盖物接口的添加函数具体如下：WebGIS.AddOverlays(data,options)；其中，第一个参数data为地理数据参数，格式为GeoJSON，包含需标注目标的空间位置信息及属性信息；第二个参数options为表示覆盖物的样式信息JSON对象；其中，通用型覆盖物接口的移除函数如下：WebGIS.removeOverlays(layerId)；其中，参数layerId为添加该覆盖物集合时提供的唯一标识。

如上的，其中，当在地图上即将执行的操作为OGC图层操作时，调用通用型OGC图层操作接口；其中，通用型OGC图层操作接口的添加函数如下：WebGIS.AddLayer(layerId,type,url,index)；其中，第一个参数layerId为OGC图层唯一标识；第二个参数type为图层类型；第三个参数url为OGC图层的服务地址；第四个参数index为OGC图层在地图上的显示顺序，数字越小显示顺序越高；其中，通用型OGC图层操作接口的删除函数如下：WebGIS.removeLayer(layerId)；其中，参数layerId为添加该图层时提供的唯一标识。

如上的，其中，通用型地图初始化接口的函数具体如下：

WebGIS.initMap(container,{mapType:val1,url:val2,zoom:val3,center:[lng,lat]})其中，第一个参数container表示承载地图的div容器的id；第二个参数mapType表示地图类型JSON对象，参数mapType为引擎类型；第三个参数url为地图服务的发布地址，用以调用该地图服务；第四个参数zoom表示该地图显示的初始默认层级；第五个参数center表示该地图显示的初始默认中心位置。

如上的，其中，在调用通用型地图初始化接口时，通用型地图初始化接口的函数必须给出第一个参数container、第二个参数mapType和第三个参数url。

本申请的通用型WebGIS开发客户端的构建方法及其使用方法建立了一种基于多引擎的通用型WebGIS客户端，在配置好相关的必要参数的条件下即可完成地图初始化，同时结合数据做地图点、线、面等覆盖物展示，以及添加符合OGC标准地图图层(如WMS、WTMS等)，更好地满足了WebGIS基本应用程序的开发，提高开发效率；同时当相同的产品更换WebGIS平台时，只需修改地图初始化的参数mapType即可，无需重新开发相关功能，进而具有减少人力成本、加快产品交付和增加产品复用性的技术效果。

附图说明

为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请中记载的一些实施例，对于本领域普通技术人员来讲，还可以根据这些附图获得其他的附图。

图1为通用型WebGIS开发客户端的构建方法一种实施例的流程图；

图2为通用型WebGIS开发客户端的使用方法一种实施例的流程图。

具体实施方式

下面结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

如图1所示，本申请提供一种通用型WebGIS开发客户端的构建方法，包括如下步骤：

S110：提取多种WebGIS客户端的常用功能。

具体的，对多种现有的WebGIS客户端中的每个WebGIS客户端通常使用的功能进行总结，并将总结的通常使用的功能作为常用功能。

其中，多种WebGIS客户端包括：百度API、高德API、、ArcGIS API for JavaScript和SuperMapAPI等。

其中，常用功能至少包括：地图初始化、地图操作、覆盖物(点、线、面)添加和OGC(Open Geospatial Consortium，开放地理空间信息联盟)图层操作。

S120：根据常用功能提取多种WebGIS客户端的功能接口，构建JavaScript基础类；其中，功能接口至少包括：地图初始化接口、地图操作JS接口，覆盖物接口和OGC图层操作接口。

具体的，创建多种现有的WebGIS客户端的JavaScript(简称JS)基础类，并提取功能接口。

其中，功能接口包括：地图初始化接口、地图操作JS接口，覆盖物接口和OGC图层操作接口。

其中，地图操作JS接口包括但不限于获取鹰眼图、比例尺的接口。覆盖物类JS接口包括但不限于点、线和面的接口。OGC图层操作JS接口包括但不限于操作WMS图层和WMTS图层的接口。

S130：利用JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口，并构建处理后的JavaScript基础类。

进一步的，利用JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口，并构建处理后的JavaScript基础类的子步骤如下：

R1：通过参数mapType确定多个WebGIS客户端的引擎类型。

具体的，通过参数mapType区分多种WebGIS客户端的引擎类型。其中，多种WebGIS客户端的引擎类型包括：百度、高德、超图和ArcGIS等引擎类型。

当mapType＝＝arcgis时，确定WebGIS客户端的引擎类型为ArcGIS。当mapType＝＝百度时，确定WebGIS客户端的引擎类型为百度。当mapType＝＝高德时，确定WebGIS客户端的引擎类型为高德。当mapType＝＝超图时，确定WebGIS客户端的引擎类型为超图。

R2：根据引擎类型确定接口类型。

具体的，确定WebGIS客户端的引擎类型后，根据引擎类型确定接口类型，其中，接口类型至少包括：地图初始化接口、地图操作接口、覆盖物接口和OGC图层操作接口。

其中，地图初始化接口包括：百度的地图初始化接口、高德的地图初始化接口、超图的地图初始化接口和ArcGIS的地图初始化接口。地图操作接口包括：百度的地图操作接口、高德的地图操作接口、超图的地图操作接口和ArcGIS的地图操作接口。覆盖物接口包括：百度的覆盖物接口、高德的覆盖物接口、超图的覆盖物接口和ArcGIS的覆盖物接口。OGC图层操作接口包括：百度的OGC图层操作接口、高德的OGC图层操作接口、超图的OGC图层操作接口和ArcGIS的OGC图层操作接口。当确定引擎类型为百度后，即可确定接口类型为：百度的地图初始化接口、百度的地图操作接口、百度的覆盖物接口和/或百度的OGC图层操作接口。

R3：对每种接口类型的接口参数进行确定，利用接口参数和JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口。

具体的，根据引擎类型确定接口类型后，根据接口类型确定每种接口类型的接口参数，利用接口参数和JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口，其中，通用型功能接口至少包括：通用型地图初始化接口、通用型地图操作JS接口、通用型覆盖物接口和通用型OGC图层操作接口。

作为一个实施例，通过编码方式利用接口参数和JavaScript基础类对提取的常用功能进行功能接口开发，获得通用型功能接口。

具体的，通过参数mapType来分别调用百度、高德、超图、ArcGIS等客户端的地图初始化接口，并通过编码方式最终形成接口名称及其参数mapType高度统一的通用型地图初始化接口。其中，地图初始化接口：用于将嵌入不同平台上发布的地图服务初始化至WebGIS客户端。

其中，获取通用型地图初始化接口的代码如下：

具体的，通过参数mapType来分别调用百度、高德、超图、ArcGIS等客户端的地图操作JS接口，并通过编码方式最终形成接口名称及其参数mapType高度统一的通用型地图操作JS接口。其中，地图操作JS接口：为用于对WebGIS客户端中的地图服务的地图操作，包括鹰眼、比例尺，即地图操作JS接口包括鹰眼接口、比例尺接口。

其中，获取通用型地图操作JS接口的代码如下：

具体的，通过参数mapType来分别调用百度、高德、超图、ArcGIS等客户端的覆盖物接口，并通过编码方式最终形成接口名称及其参数mapType高度统一的通用型覆盖物接口。

其中，获取通用型覆盖物接口的代码如下：

具体的，通过参数mapType来分别调用百度、高德、超图、ArcGIS等客户端的OGC图层操作接口，并通过编码方式最终形成接口名称及其参数mapType高度统一的通用型OGC图层操作接口。

其中，获取通用型OGC图层操作接口的代码如下：

R4：利用通用型功能接口构建处理后的JavaScript基础类，并将参数mapType设置为处理后的JavaScript基础类的全局属性。

具体的，调用通用型功能接口时，直接通过全局属性区分WebGIS客户端的引擎类型，并调用该WebGIS客户端相应的功能接口，达到接口名称与参数mapType高度统一的目的。

S140：通过前端打包工具对处理后的JavaScript基础类进行打包，并整合为一个文件，完成整合后将该文件作为通用型WebGIS框架的引入接口。

具体的，通过WebPack、Babel等前端打包工具，对处理后的JavaScript基础类(即通用型地图初始化接口、通用型地图操作JS接口、通用型覆盖物接口和通用型OGC图层操作接口)进行打包，整合成一个文件，并将该文件作为WebGIS开发框架的引入接口。

S150：若需要开发新的通用型功能接口，则执行S130-S140进行继承开发。

如图2所示，本发明还提供了一种通用型WebGIS开发客户端的使用方法，包括如下步骤：

S210：通过HTML Script标签引入通过上述的通用型WebGIS开发客户端的构建方法构建的通用型WebGIS框架。

具体的，HTML Script标签用于定义客户端脚本。通过HTML Script标签引入通过上述的通用型WebGIS开发客户端的构建方法构建的通用型WebGIS框架，执行S220。

S220：调用通用型WebGIS框架中的通用型地图初始化接口完成地图初始化，展示出地图。

具体的，地图初始化功能以函数的形式提供给编程人员，通用型地图初始化接口的函数具体如下：WebGIS.initMap(container,{mapType:val1,url:val2,zoom:val3,center:[lng,lat]})

其中，第一个参数container表示承载地图的div(HTML的dom元素)容器的id，可以通过调整该div的位置大小以及风格来改变地图的显示位置风格等。第二个参数mapType表示地图类型JSON对象，参数mapType为引擎类型。第三个参数url为地图服务的发布地址，用以调用该地图服务。第四个参数zoom表示该地图显示的初始默认层级。第五个参数center表示该地图显示的初始默认中心位置。

进一步的，在调用通用型地图初始化接口时，通用型地图初始化接口的函数必须给出第一个参数container、第二个参数mapType和第三个参数url。

作为一个实施例，在调用通用型地图初始化接口时，通用型地图初始化接口的函数不必给出第四个参数zoom和第五个参数center。

作为另一个实施例，在调用通用型地图初始化接口时，通用型地图初始化接口的函数需要给出第四个参数zoom和第五个参数center。

S230：确定在地图上即将执行的操作，根据即将执行的操作从通用型WebGIS框架中调取相应的通用型功能接口进行使用。

具体的，即将执行的操作至少包括：地图操作初始化、覆盖物(点、线、面)添加和OGC图层操作。

通用型功能接口至少包括：通用型地图操作JS接口、通用型覆盖物接口和通用型OGC图层操作接口。

进一步的，当在地图上即将执行的操作为地图操作初始化时，调用通用型地图操作JS接口。

具体的，地图辅助工具预先存储于通用型WebGIS框架中，用户只需要通过传入参数便可调用地图辅助工具，并可自定义地图辅助工具的显示位置。

通用型地图操作JS接口的函数具体如下：

WebGIS.initTools(type,options)；

其中，第一个参数type代表地图操作类型，如比例尺、鹰眼等；第二个参数options表示地图操作的样式信息JSON对象。

当地图默认为不显示鹰眼、比例尺时，直接调用通用型地图操作JS接口。若想对鹰眼、比例尺等控件进行显示，则需要设置对应的显示设置参数。

具体的，鹰眼的显示设置参数为JSON对象，包括position、width、height，其中position表示鹰眼在地图容器div里边的显示位置，而width和height分别代表鹰眼的宽和高。

具体的，比例尺的显示设置参数包括position。

其中，position表示鹰眼在地图容器div里边的显示位置。

进一步的，当在地图上即将执行的操作为覆盖物(点、线、面)添加时，调用通用型覆盖物接口。

通过用户自定义的空间数据及样式数据，并利用该数据通过调用覆盖物添加接口完成在地图上相应覆盖物的标注，该覆盖物添加功能以函数形式提供给编程人员，通用型覆盖物接口的添加函数具体如下：

WebGIS.AddOverlays(data,options)；

其中，第一个参数data为地理数据参数，格式为GeoJSON，包含需标注目标的空间位置信息及属性信息。第二个参数options为表示覆盖物的样式信息JSON对象，如覆盖物为点时，样式信息主要包含：{layerId:val,iconUrl:val1,iconSize:val2,isShowLabel:val3,labeFontColor:[val4]labeFonttSize：val5,labelXoffset:val6,labelYoffset:val7}。

其中，layerId为必需参数，表示标注集合唯一标识。iconUrl为特定图片进行标记时所要标记的图片路径。iconSize为标注大小。isShowLabel表示是否显示标签。labeFontColor为显示的标签字体颜色。labeFonttSize表示显示标签字体大小。labelXoffset、labelYoffset分别表示标签相对于对应坐标点的X轴偏移量和Y轴偏移量。

同时通用型WebGIS框架还提供了通用型覆盖物接口的移除函数：

WebGIS.removeOverlays(layerId)；

其中，参数layerId为添加该覆盖物集合时提供的唯一标识。

进一步的，当在地图上即将执行的操作为OGC图层操作时，调用通用型OGC图层操作接口。

具体的，OGC图层操作功能以函数形式提供给编程人员，通用型OGC图层操作接口的添加函数如下：

WebGIS.AddLayer(layerId,type,url,index)；

其中，第一个参数layerId为OGC图层唯一标识；第二个参数type为图层类型，作为一个实施例，图层类型包括WMS图层、WMTS图层、WFS图层等；第三个参数url为OGC图层的服务地址；第四个参数index为OGC图层在地图上的显示顺序，数字越小显示顺序越高。

同时通用型WebGIS框架还提供了删除OGC图层的函数，通用型OGC图层操作接口的删除函数如下：

WebGIS.removeLayer(layerId)；

其中，参数layerId为添加该图层时提供的唯一标识。

本申请的通用型WebGIS开发客户端的构建方法及其使用方法建立了一种基于多引擎的通用型WebGIS客户端，在配置好相关的必要参数的条件下即可完成地图初始化，同时结合数据做地图点、线、面等覆盖物展示，以及添加符合OGC标准地图图层(如WMS、WTMS等)，更好地满足了WebGIS基本应用程序的开发，提高开发效率；同时当相同的产品更换WebGIS平台时，只需修改地图初始化的参数mapType即可，无需重新开发相关功能，进而具有减少人力成本、加快产品交付和增加产品复用性的技术效果。

尽管已描述了本申请的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，本申请的保护范围意欲解释为包括优选实施例以及落入本申请范围的所有变更和修改。显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请保护范围及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。