一种电子地图中自定义区域展示方法、装置及电子设备

技术领域

本申请涉及电子地图技术领域，具体而言，涉及一种电子地图中自定义区域展示方法、装置及电子设备。

背景技术

WMS（全称是“Web Map Service”）服务作为OGC标准里面最常用的服务之一，是一种地理数据可视化技术方法，它能够利用具有地理空间位置信息的数据制作地图。

目前，基于Leaflet框架加载的WMS服务只能根据CQL（Class Query Language，类查询语言）来进行地图中区域范围的筛选，它依赖于地图信息系统（GeographicInformation System ，GIS）数据的结构，只能根据已有的字段和条件进行区域范围过滤，例如：仅能根据城市名称对地图中指定范围的区域进行高亮显示，无法对自定义区域进行展示。

发明内容

有鉴于此，本申请的目的在于提供一种电子地图中自定义区域展示方法、装置及电子设备，以解决现有技术中，无法在电子地图中进行自定义区域展示的问题。

第一方面，本申请实施例提供了一种电子地图中自定义区域展示方法，包括：

响应于针对地图中自定义目标区域的展示指令，获取自定义目标区域对应的第一几何边界及可视化区域中地图上的多个瓦片；

针对每个瓦片，确定该瓦片是否为与第一几何边界存在交集的目标瓦片；

若为目标瓦片，确定与该瓦片对应的画布的区域绘制边界，按照区域绘制边界对画布进行绘制及填充处理，生成该瓦片对应的渲染图像；

在可视化区域中展示所有目标瓦片对应的渲染图像。

可选地，针对每个瓦片，确定该瓦片是否为与第一几何边界存在交集的目标瓦片，包括：获取该瓦片的位置信息，根据位置信息确定该瓦片对应的第二几何边界；将第一几何边界与第二几何边界进行比较，确定边界是否存在交集；若存在交集，将该瓦片作为目标瓦片。

可选地，将第一几何边界与第二几何边界进行比较，确定边界是否存在交集，包括：若第一几何边界与第二几何边界相交或者第二几何边界处于第一几何边界内，则确定边界存在交集；若第一几何边界与第二几何边界不相交且第二几何边界不处于第一几何边界内，则确定边界不存在交集。

可选地，在根据位置信息确定该瓦片对应的第二几何边界之前，还包括：确定自定义目标区域是否存在；若自定义目标区域不存在，将该瓦片作为目标瓦片。

可选地，位置信息包括该瓦片的行号、列号及当前地图层级，根据位置信息确定该瓦片对应的第二几何边界，包括：根据行号、列号及当前地图层级，确定该瓦片的左上角坐标及右下角坐标；根据左上角坐标及右下角坐标，确定第二几何边界。

可选地，在确定所述自定义目标区域是否存在之后，还包括： 创建与该瓦片的位置信息对应的缓存标识；将该瓦片的第二几何边界以缓存标识进行缓存。

可选地，确定与该瓦片对应的画布的区域绘制边界，包括：若第一几何边界与该瓦片对应的第二几何边界相交，将第二几何边界内的第一几何边界作为该瓦片对应的画布上的区域绘制边界。

可选地，按照区域绘制边界对画布进行绘制及填充处理，生成该瓦片对应的渲染图像，包括：按照区域绘制边界对画布进行裁剪，获得裁剪后的画布；利用该瓦片对裁剪后的画布进行填充，获得待渲染瓦片；对待渲染瓦片进行渲染处理，获得该瓦片对应的渲染图像。

第二方面，本申请实施例还提供了一种电子地图中自定义区域展示装置，所述装置包括：

获取模块，用于响应于针对地图中自定义目标区域的展示指令，获取自定义目标区域对应的第一几何边界及可视化区域中地图上的多个瓦片；

判断模块，用于针对每个瓦片，确定该瓦片是否为与第一几何边界存在交集的目标瓦片；

处理模块，用于若为目标瓦片，确定与该瓦片对应的画布的区域绘制边界，按照区域绘制边界对画布进行绘制及填充处理，生成该瓦片对应的渲染图像；

展示模块，用于在可视化区域中展示所有目标瓦片对应的渲染图像。

第三方面，本申请实施例还提供一种电子设备，包括：处理器、存储器和总线，所述存储器存储有所述处理器可执行的机器可读指令，当电子设备运行时，所述处理器与所述存储器之间通过总线通信，所述机器可读指令被所述处理器执行时执行如上述的电子地图中自定义区域展示方法的步骤。

本申请实施例带来了以下有益效果：

本申请实施例提供的一种电子地图中自定义区域展示方法、装置及电子设备，能够根据自定义目标区域的第一几何边界与每个瓦片之间的位置关系选取可视化区域中的目标瓦片，通过目标瓦片可以确定需要特殊处理的自定义目标区域在电子地图上的位置，然后根据区域绘制边界对需要处理的每个瓦片的画布进行绘制及填充处理，得到自定义目标区域对应的渲染图像，以在可视化区域中展示渲染图像，与现有技术中的电子地图中自定义区域展示方法相比，解决了现有技术中，无法在电子地图中进行自定义区域展示的问题。

为使本申请的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。

附图说明

为了更清楚地说明本申请实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

图1示出了本申请实施例所提供的电子地图中自定义区域展示方法的流程图；

图2示出了本申请实施例所提供的电子地图中自定义区域展示装置的结构示意图；

图3示出了本申请实施例所提供的电子设备的结构示意图。

具体实施方式

为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本申请实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本申请的实施例的详细描述并非旨在限制要求保护的本申请的范围，而是仅仅表示本申请的选定实施例。基于本申请的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的每个其他实施例，都属于本申请保护的范围。

值得注意的是，在本申请提出之前，WMS服务作为OGC标准里面最常用的服务之一，是一种地理数据可视化技术方法，它能够利用具有地理空间位置信息的数据制作地图。目前，基于Leaflet框架加载WMS服务的方法是由Leaflet官方提供的加载方法，该方法只能根据CQL来进行地图中区域范围的筛选，它依赖于GIS数据的结构，只能根据已有的字段和条件进行区域范围过滤，过滤方式不够灵活，例如：仅能对电子地图中城市名称、景点名称或者特定场所对应的区域进行高亮显示，无法对用户自定义区域进行展示。以对某区域的人口数据进行展示为例，现有技术仅能按照已有字段进行筛选，例如：只能筛选特定城市的人口数据，而无法对自定义目标区域中的人口数据进行显示。

基于此，本申请实施例提供了一种电子地图中自定义区域展示方法，以解决无法展示用户自定义区域的问题。

本申请通过全新开发的WMS服务的加载插件来实现自定义区域展示方法，该加载插件在原有加载服务所需的参数基础上，新增了空间范围参数，空间范围参数用于表征自定义目标区域对应的第一几何边界。

本申请通过JavaScript编程语言来实现WMS服务按自定义区域进行加载的方法，该加载方法继承自L.TileLayer.WMS，且通过重写createTile方法来实现步骤S101至步骤S104。

请参阅图1，图1为本申请实施例所提供的一种电子地图中自定义区域展示方法的流程图。如图1所示，本申请实施例提供的电子地图中自定义区域展示方法，包括：

步骤S101，响应于针对地图中自定义目标区域的展示指令，获取自定义目标区域对应的第一几何边界及可视化区域中地图上的多个瓦片。

该步骤中，地图可指电子地图，地图可以显示在浏览器中，也可以显示在应用中。

自定义目标区域可指用户在地图中选取的任意形状的封闭区域。自定义目标区域的选取方法：可以通过在地图服务中输入自定义目标区域的边界上的多个边界点位置及区域形状来确定，也可以直接在地图中通过绘制边界的方式来确定。其中，区域形状可以是圆形、椭圆形、正方形、矩形等。

展示指令可以是通过用户的点击操作或者按压操作来触发。

第一几何边界可指自定义目标区域的几何边界，如果自定义目标区域为长方形，则第一几何边界也为长方形；如果自定义目标区域为圆形，则第一几何边界也为圆形。

可视化区域可指展示地图的窗口，示例性的，可视化区域可指浏览器中用于显示地图的区域，可视化区域的范围可以是1024×768，可通过滑动屏幕等方式调整可视化区域中地图的显示内容。

瓦片可指地图瓦片，瓦片是对地图切片后获得的矩形区域，一个地图由多个瓦片构成。

在本申请实施例中，用户可通过终端设备上安装的浏览器或者应用程序来获取地图服务，终端设备包括但不限于：智能手机、电脑、PAD、智能手表、笔记本。以浏览器为例，浏览器的窗口即为可视化区域，用户输入自定义目标区域对应的空间范围参数。

在用户点击“搜索”按钮时，浏览器根据该空间范围参数生成展示指令，WMS服务响应于该展示指令，获取自定义目标区域对应的第一几何边界及浏览器窗口范围内地图上的多个瓦片。

具体实现时，该步骤分为创建服务对象、确定第一几何边界、获取WMS服务数据。

创建服务对象：改写createTile中的initialize初始化方法，在initialize的固有属性（options）里面注入geometry参数，该geometry参数是表征需要显示的自定目标区域对应的空间范围参数，且以GeoJSON标准格式来配置该参数。

确定第一几何边界：通过自定义的数据处理内部方法来确定第一几何边界，将geometry参数作为数据处理内部方法的传入参数，数据处理内部方法通过geometry参数计算出第一几何边界，以geometry参数为多个边界点及区域形状为例，通过多个边界点及区域形状可以计算出第一几何边界。

获取WMS服务数据：通过父级对象（L.TileLayer.WMS）的getTileUrl方法，获取数据资源路径，该数据资源路径用于指示可视化区域中地图上的每个瓦片对应的图像资源的路径。

步骤S102，针对每个瓦片，确定该瓦片是否为与第一几何边界存在交集的目标瓦片。

该步骤中，存在交集指的是瓦片的边界与第一几何边界相交或者瓦片处于第一几何边界内。

目标瓦片即为与第一几何边界相交或者处于第一几何边界内的瓦片。

在本申请实施例中，可以并行确定每个瓦片与第一几何边界是否存在交集，如果一个瓦片与自定义目标区域的第一几何边界存在交集，则将该瓦片作为目标瓦片，并对该目标瓦片进行相应的标记。

具体实现时，可通过自定义的数据处理内部方法来判断当前瓦片是否与自定义目标区域存在交集，在数据处理内部方法内部可利用intersects方法比对第一几何边界和第二几何边界是否相交。其中, 数据处理内部方法的参数还包括数据资源路径，通过数据资源路径获取瓦片的原始图像。

在一可选实施例中，步骤S102，包括：步骤a1至步骤a3。

步骤a1，获取该瓦片的位置信息，根据位置信息确定该瓦片对应的第二几何边界。

WMS服务已为每个瓦片提供了对应的位置信息，根据瓦片的位置信息及瓦片的尺寸信息，可通过步骤a11至步骤a12计算出该瓦片的第二几何边界，第二几何边界表征该瓦片所在的区域。其中，同一地图层级下，所有瓦片的尺寸是相同的。

步骤a2，将第一几何边界与第二几何边界进行比较，确定边界是否存在交集。

将每个瓦片的第二几何边界与第一几何边界进行比对，根据步骤a21至步骤a22确定边界是否存在交集，也是确定瓦片与自定义目标区域是否存在交集。

步骤a3，若存在交集，将该瓦片作为目标瓦片。

如果存在交集，说明瓦片与自定义目标区域相交或者瓦片处于自定义目标区域内，于是将该瓦片作为目标瓦片，以对目标瓦片进行裁剪处理。

在一可选实施例中，位置信息包括该瓦片的行号、列号及当前地图层级，步骤a1中根据位置信息确定该瓦片对应的第二几何边界，包括：步骤a11至步骤a21。

步骤a11，根据行号、列号及当前地图层级，确定该瓦片的左上角坐标及右下角坐标。

这里，行号记作：x，列号记作：y，当前地图层级记作：z。根据x、y、z，可以计算出该瓦片的左上角坐标及右下角坐标，左上角坐标及右下角坐标的计算公式如下：

；

；

上式中，tilesize表示瓦片的尺寸，瓦片的尺寸是固定数值，例如：tilesize 取256。

步骤a12，根据左上角坐标及右下角坐标，确定第二几何边界。

将确定瓦片的左上角坐标及右下角坐标输入至L.Bounds函数中，获得第二几何边界，该第二几何边界为经纬度边界（bounding box，bbox），是Leaflet框架可以识别的边界。

在一可选实施例中，步骤a2，包括：步骤a21至步骤a22。

步骤a21，若第一几何边界与第二几何边界相交或者第二几何边界处于第一几何边界内，则确定边界存在交集。

瓦片与自定义目标区域是否存在交集包括两种情况，一种是瓦片的边界与自定义目标区域的边界相交，另一种是瓦片在自定义目标区域内。

如果第一几何边界与第二几何边界相交，说明瓦片处于自定义目标区域的边界上，如果第二几何边界处于第一几何边界内，说明瓦片处于自定义目标区域内，上述两种情况均可确定为边界存在交集。

步骤a22，若第一几何边界与第二几何边界不相交且第二几何边界不处于第一几何边界内，则确定边界不存在交集。

反之，如果第二几何边界既不与第一几何边界相交，也不处于第一几何边界内，说明瓦片处于自定义目标区域外，即边界不存在交集。

在一可选实施例中，在步骤a1中根据位置信息确定该瓦片对应的第二几何边界之前，还包括：步骤b1至步骤b2。

步骤b1，确定自定义目标区域是否存在。

在获取瓦片的位置信息之后，首先判断自定义目标区域是否存在。

步骤b2，若自定义目标区域不存在，将该瓦片作为目标瓦片。

如果自定义目标区域不存在，说明可视化区域中的所有瓦片都需要进行视图层渲染，于是将当前瓦片作为目标瓦片，并标记为isIn。

如果自定义目标区域存在，需要确定瓦片与自定义目标区域是否存在交集。

在一可选实施例中，在步骤b1之后，还包括：步骤c1至步骤c2。

步骤c1，创建与该瓦片的位置信息对应的缓存标识。

为了避免地图缩放时重复计算瓦片的第二几何边界，可在计算第二几何边界之前，以该瓦片的行号、列号及当前地图层级为参数创建缓存ID。

步骤c2，将该瓦片的第二几何边界以缓存标识进行缓存。

在确定第二几何边界之后，在缓存中以创建的缓存ID对该第二几何边界数据进行缓存。

步骤S103， 若为目标瓦片，确定与该瓦片对应的画布的区域绘制边界，按照区域绘制边界对画布进行绘制及填充处理，生成该瓦片对应的渲染图像。

该步骤中，目标瓦片是与自定义目标区域有交集的瓦片，如果目标瓦片是与自定义目标区域相交的，则需要将目标瓦片与自定义目标区域重叠部分保留，将该瓦片中除重叠部分外的部分裁剪掉；如果目标瓦片处于自定义目标区域内，则无需对目标瓦片进行裁剪。为此，需要确定画布上的区域绘制边界，以根据区域绘制边界对画布进行绘制及填充处理，获得慕白哦瓦片对应的渲染图像。

在一可选实施例中，步骤S103中确定与该瓦片对应的画布的区域绘制边界，包括：步骤d1。

步骤d1，若第一几何边界与该瓦片对应的第二几何边界相交，将第二几何边界内的第一几何边界作为该瓦片对应的画布上的区域绘制边界。

以瓦片N对应的画布n为例，如果第一几何边界与瓦片N的第二几何边界相交，说明需要按照第一几何边界对画布n进行裁剪，于是将处于第二几何边界内的第一几何边界及处于第一几何边界内的第二几何边界作为画布n的区域绘制边界。其中，区域绘制边界对应的区域也是封闭图形。

如果瓦片N的第二几何边界处于第一几何边界内，说明瓦片对应的区域是自定义目标区域内的一部分，可直接将该瓦片放入视图层进行渲染。

在一可选实施例中，步骤S103中按照区域绘制边界对画布进行绘制及填充处理，生成该瓦片对应的渲染图像，包括：步骤d2至步骤d4。

步骤d2，按照区域绘制边界对画布进行裁剪，获得裁剪后的画布。

在瓦片N对应的画布n上，按照区域绘制边界对画布n进行裁剪，将除裁剪掉的部分外的其余部分作为裁剪后的画布。

步骤d3，利用该瓦片对裁剪后的画布进行填充，获得待渲染瓦片。

使用瓦片N的原始图像对裁剪后的画布n进行填充，也可以理解为按照瓦片N的原来位置将裁剪后的画布n与瓦片N的原始图像重叠在一起，获得待渲染瓦片。裁剪后的画布相当于遮罩，用来隐藏没有遮罩的瓦片上的区域。

步骤d4，对待渲染瓦片进行渲染处理，获得该瓦片对应的渲染图像。

在视图层对待渲染瓦片进行渲染，获得瓦片N的渲染图像。

步骤S104，在可视化区域中展示所有目标瓦片对应的渲染图像。

该步骤中，在浏览器的窗口对应的可视化区域内，显示所有瓦片的渲染图像，得到包括自定义目标区域在内的地图。当然，在可视化区域内还显示有除自定义目标区域外的其他地图部分，只是自定义目标区域与除自定义目标区域外的其他地图部分被区分显示，例如：自定义目标区域以高亮显示。

另外，还可以将自定义目标区域的渲染图像居中显示，以及针对自定义目标区域的大小调整当前地图层级，以为用户提供更合适尺寸的地图信息。

在完成自定义目标区域的显示之后，可以将自定义目标区域与待统计数据项进行关联，同时获取自定义目标区域内待统计数据项对应的统计结果，以在自定义目标区域上显示对应的统计结果，例如：在地图上显示自定义目标区域中的人口统计结果，实现灵活、可视化的数据统计。

与现有技术中电子地图中自定义区域展示方法相比，本申请能够根据自定义目标区域的第一几何边界与每个瓦片之间的位置关系选取可视化区域中的目标瓦片，通过目标瓦片可以确定需要特殊处理的自定义目标区域在电子地图上的位置，然后根据区域绘制边界对需要处理的每个瓦片的画布进行绘制及填充处理，得到自定义目标区域对应的渲染图像，以在可视化区域中展示渲染图像，解决了现有技术中，无法在电子地图中进行自定义区域展示的问题。

基于同一发明构思，本申请实施例中还提供了与电子地图中自定义区域展示方法对应的电子地图中自定义区域展示装置，由于本申请实施例中的装置解决问题的原理与本申请实施例上述电子地图中自定义区域展示方法相似，因此装置的实施可以参见方法的实施，重复之处不再赘述。

请参阅图2，图2为本申请实施例所提供的一种电子地图中自定义区域展示装置的结构示意图。如图2中所示，所述电子地图中自定义区域展示装置200包括：

获取模块201，用于响应于针对地图中自定义目标区域的展示指令，获取自定义目标区域对应的第一几何边界及可视化区域中地图上的多个瓦片；

判断模块202，用于针对每个瓦片，确定该瓦片是否为与第一几何边界存在交集的目标瓦片；

处理模块203，用于若为目标瓦片，确定与该瓦片对应的画布的区域绘制边界，按照区域绘制边界对画布进行绘制及填充处理，生成该瓦片对应的渲染图像；

展示模块204，用于在可视化区域中展示所有目标瓦片对应的渲染图像。

在一可选实施例中，判断模块202包括：边界确定模块，用于获取该瓦片的位置信息，根据位置信息确定该瓦片对应的第二几何边界；比较模块，用于将第一几何边界与第二几何边界进行比较，确定边界是否存在交集；目标瓦片确定模块，用于若存在交集，将该瓦片作为目标瓦片。

在一可选实施例中，比较模块具体用于：若第一几何边界与第二几何边界相交或者第二几何边界处于第一几何边界内，则确定边界存在交集；若第一几何边界与第二几何边界不相交且第二几何边界不处于第一几何边界内，则确定边界不存在交集。

在一可选实施例中，判断模块202还包括区域确定模块，区域确定模块用于：确定自定义目标区域是否存在；若自定义目标区域不存在，将该瓦片作为目标瓦片。

在一可选实施例中，位置信息包括该瓦片的行号、列号及当前地图层级，边界确定模块具体用于：根据行号、列号及当前地图层级，确定该瓦片的左上角坐标及右下角坐标；根据左上角坐标及右下角坐标，确定第二几何边界。

在一可选实施例中，判断模块202还包括缓存模块，缓存模块用于： 创建与该瓦片的位置信息对应的缓存标识；将该瓦片的第二几何边界放入缓存标识对应的缓存中进行存储。

在一可选实施例中，处理模块203具体用于：若第一几何边界与该瓦片对应的第二几何边界相交，将第二几何边界内的第一几何边界作为该瓦片对应的画布上的区域绘制边界。

在一可选实施例中，处理模块203还具体用于：按照区域绘制边界在画布上绘制需要显示的瓦片边界，按照瓦片边界对画布进行裁剪，获得裁剪后的画布；利用该瓦片对裁剪后的画布进行填充，获得填充后的画布；对填充后的画布进行渲染，获得该瓦片对应的渲染图像。

请参阅图3，图3为本申请实施例所提供的一种电子设备的结构示意图。如图3中所示，所述电子设备300包括处理器310、存储器320和总线330。

所述存储器320存储有所述处理器310可执行的机器可读指令，当电子设备300运行时，所述处理器310与所述存储器320之间通过总线330通信，所述机器可读指令被所述处理器310执行时，可以执行如上述图1所示方法实施例中的电子地图中自定义区域展示方法的步骤，具体实现方式可参见方法实施例，在此不再赘述。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统、装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。

在本申请所提供的几个实施例中，应该理解到，所揭露的系统、装置和方法，可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，又例如，多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些通信接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本申请各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。

所述功能如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个处理器可执行的非易失的计算机可读取存储介质中。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备（可以是个人计算机，服务器，或者网络设备等）执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器（Read-OnlyMemory，ROM）、随机存取存储器（Random Access Memory，RAM）、磁碟或者光盘等各种可以存储程序代码的介质。

最后应说明的是：以上所述实施例，仅为本申请的具体实施方式，用以说明本申请的技术方案，而非对其限制，本申请的保护范围并不局限于此，尽管参照前述实施例对本申请进行了详细的说明，本领域的普通技术人员应当理解：任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，其依然可以对前述实施例所记载的技术方案进行修改或可轻易想到变化，或者对其中部分技术特征进行等同替换；而这些修改、变化或者替换，并不使相应技术方案的本质脱离本申请实施例技术方案的精神和范围，都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应以权利要求的保护范围为准。