基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统与流程

本发明涉及一种电子地图注记技术，特别涉及一种基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统。

背景技术：

注记一直以来就被当成地图的一部分，解释地图的语言，注记位置的配置问题是地图制作过程中的难题之一。电子地图方便携带，实时，动态等优势弥补了传统地图体积大、不易携带、不易保存等缺点而在越来越多的领域得到使用。电子地图有可以任意调整比例尺、分层显示、三维立体显示的特点，实时、动态的要求使电子地图中的注记位置摆放更加困难，注记的动态避让摆放，是一个典型的NP难度问题，而电子地图的实时变化比例尺的特点更需要注记的动态摆放和避让。国内外学者针对点要素注记配置做了诸多主要研究：聚类搜索算法、模拟退火算法、神经网络算法、禁忌搜索算法、遗传算法、回溯法，以及网格算法等。目前的网络上浏览器或地图APP，用的注记方式是将点、线、面注记根据比例尺大小按点要素重要性选部分点要素进行注记配置，在小比例尺情况下房屋等点要素表现为点状点要素。当这些地图注记标注方法用在其他用途上，比如在点要素可以单独移动的大型复杂网络拓扑模型，有时有对点要素进行注记的需要，此时注记相对于点要素的位置是固定的，移动后就会出现压盖其他点要素注记的情况。大量点要素相邻时，即便其它点要素有位置放注记，也只有部分点要素能进行注记，且屏幕边缘的点要素注记并没有避开边缘，会出现部分位于屏幕外的情况。此外当界面移动时，有些点要素有可以显示注记的位置却并没有放注记。

拓扑可视化中的点要素是拓扑图中的重要组成之一，有些拓扑图需要知道某些点要素的相关信息，普通注记的方式无法满足拓扑图中点要素注记的需求，例如注记相对于点要素的位置是固定的，在单独移动某一个点要素时，一种情况是注记并不随着点要素移动；另外一种是点要素和注记的相对位置不变，移动后会出现压盖其它注记的情况，注记的位置也没有避开屏幕边缘，出现部分注记位于屏幕内情况，会对点要素识别造成困扰，所以需要一种新的注记方式，为点要素标注相关信息，并使点要素之间的注记自动避让，不互相压盖。

技术实现要素：

有鉴于此，有必要提供一种注记位置能够根据屏幕内点要素的变化而进行动态变化，同时能够避免注记在点要素移动的情况下发生被其他注记压盖问题的基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统。

一种基于浏览器进行复杂网络拓扑图点要素注记的绘制方法，所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法包括如下步骤：

S1、以点要素最小外接矩形为中心，在点要素最小外接矩形的周围设置至少一个候选注记位置；

S2、获取注记配置所需的参数，筛选出位于屏幕内的点要素集合，及位于屏幕内的点要素的注记集合；

S3、以候选注记位置的最大范围作点要素的最大外接矩形，自点要素集合、注记集合中筛选出与最大外接矩形相交的点要素数组、注记数组；

S4、筛选出位于屏幕内的候选注记位置，并根据点要素数组、注记数组判断候选注记位置范围内是否有点要素或已标注其他注记，根据判断结果决定是否进行注记。

一种基于浏览器进行复杂网络拓扑图点要素注记的绘制系统，所述基于浏览器进行复杂网络拓扑图点要素注记的绘制系统包括如下功能模块：

候选位置设置模块、用于以点要素最小外接矩形为中心，在点要素最小外接矩形的周围设置至少一个候选注记位置；

集合筛选模块、用于获取注记配置所需的参数，筛选出位于屏幕内的点要素集合，及位于屏幕内的点要素的注记集合；

数组筛选模块、用于以候选注记位置的最大范围作点要素的最大外接矩形，自点要素集合、注记集合中筛选出与最大外接矩形相交的点要素数组、注记数组；

注记判断模块、用于根据点要素数组、注记数组判断候选注记位置范围内是否有点要素或已标注其他注记，并根据判断结果决定是否进行注记。

本发明所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统，其通过在点要素周围设置候选注记位置，根据点要素的实时位置变化，判断其周围是否有足够的位置用于设置注记，从而构建注记矩形动态避让模型，使所述注记位置根据屏幕内点要素的变化而变化，避免了注记在点要素移动的情况下发生被其他注记压盖问题，同时对屏幕内点要素进行注记位置配置，注记会自动避开屏幕边缘，因此不会出现注记的一部分位于屏幕外的情况。本发明所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统既可以最大数量的将点要素注记显示出来，还可以避免注记被屏幕边缘压盖出现混淆的情况。

附图说明

图1是本发明实施例的基于浏览器进行复杂网络拓扑图点要素注记的绘制方法流程图；

图2是本发明实施例中注记位置分布顺序图；

图3是图1中步骤S2的子流程图；

图4是图1中步骤S3的子流程图；

图5是本发明实施例中点要素最小外接矩形及最大外接矩形示意图；

图6为本发明实施例中步骤S2至步骤S3的工作流程示意图；

图7是图1中步骤S4的子流程图；

图8是本发明实施例中步骤S4的工作流程示意图；

图9是本发明实施例的特殊位置点要素效果图。

具体实施方式

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明，应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

如图1所示，本发明实施例提供一种基于浏览器进行复杂网络拓扑图点要素注记的绘制方法，所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法包括如下步骤：

S1、以点要素j的最小外接矩形为中心，在点要素j最小外接矩形的周围设置至少一个候选注记位置i。

本发明实施例中，在点要素j最小外接矩形的上下左右方向标记四个候选注记位置i，且候选注记位置i也是矩形框。

具体的，本发明实施例还指定了候选注记位置i的配置规则

(1)基于英文注记无法竖向注记，模型中所有注记都是横向；

(2)如图2所示，以点要素j最小外接矩形中心为中心，按顺时针方向正上方为候选注记位置i的第一候选位置，依次类推，正右方为第二候选位置，正下方为第三候选位置，正左方为第四候选位置；

(3)若四个方向均有其它点或者其它注记存在，即没有合适的候选位置放注记，将注记放在该候选位置会压盖其它点要素j，那该点就不进行注记配置；

(4)若点要素可能没有合适注记位置，则按重要性分级对注记位置i进行配置；

(5)若候选注记位置i与屏幕边界有相交，则进行下一个候选位置的判断。具体所述候选注记位置i的最大坐标、最小坐标以及绘制坐标(左下角坐标)的计算方法如下：

第一候选位置的最大最小坐标：

Txmin＝x–tw/2；Tymin＝y–h/2–lh-dis；

Txmax＝x+tw/2；Tymax＝y–h/2-dis；

绘制坐标：Tx＝x–tw/2；Ty＝y–h/2-dis；

第二候选位置的最大最小坐标：

Rxmin＝x+w/2+dis；Rymin＝y–lh/2；

Rxmax＝x+w/2+dis+tw；Rymax＝y+lh/2；

绘制坐标：Rx＝x+w/2+dis；Ry＝y+lh/2；

第三候选位置的最大最小坐标：

Bxmin＝x–tw/2；Bymin＝y+h/2+dis；

Bxmax＝x+tw/2；Bymax＝y+h/2+dis+lh；

绘制坐标：Bx＝x–tw/2；By＝y+h/2+dis+lh；

第四候选位置的最大最小坐标：

Lxmin＝x–w/2–dis–tw；Lymin＝y–lh/2；

Lxmax＝x-w/2–dis；Lymax＝y+lh/2；

绘制坐标：Lx＝x–w/2–dis–tw；Ly＝y+lh/2。

S2、获取注记配置所需的参数，筛选出位于屏幕内的点要素集合Points，及位于屏幕内的点要素j的注记集合Label。

如图3所示，所述步骤S2包括以下分步骤：

S21、获取注记配置所需的参数，以屏幕坐标范围为筛选条件，使用矩形判断法自全部点要素j中筛选出位于屏幕内的点要素集合Points；具体的，使用矩形判断法判断点要素j是否位于屏幕内；如果点要素j落入屏幕范围内，则归集到点要素集合Points中，反之则不归集至点要素集合Points中。

S22、建立一注记集合Label，将根据点要素集合Points中的点要素j计算得到的注记位置i归集至注记集合Label中；所述注记集合Label在还未进行位置计算时是一个空数组，即屏幕中不存在任何注记，则第一个计算的点要素j候选注记位置i不会压盖其他的注记，则第一个计算的点要素j的四个候选注记位置i都能够进行注记，将最终得到的注记位置i存入注记集合Label中，从而产生注记集合Label中的第一个注记位置i，依次循环进行下一个点要素j注记的计算，并继续将计算得到的注记位置i存入注记集合Label中。

其中，所述注记配置所需的参数包括点要素j中心坐标，点要素j与屏幕边界平行的最小外接矩形的宽和高，以点要素j注记的宽和高做注记的外接矩形，注记外接矩形距点要素j最小外接矩形的距离，注记的宽，注记的高。

上述矩形判断法包括以下四种情况：

第一个矩形的X轴最小坐标值大于第二个矩形的X轴最大坐标值；

第一个矩形的Y轴最大坐标值小于第二个矩形的Y轴最小坐标值；

第一个矩形的X轴最大坐标值小于第二个矩形的X轴最小坐标值；

第一个矩形的Y轴最小坐标值大于第二个矩形的Y轴最大坐标值；

如果满足上述情况中的其中一种，则两个矩形不相交，反之两个矩形相交。

具体的，假设两个水平方向的矩形A:(ax1,ay1)、(ax2,ay2)、(ax3,ay3)、(ax4,ay4)，B:(bx1,by1)、(bx2,by2)、(bx3,by3)、(bx4,by4)，坐标是从左上角顺时针顺序，根据屏幕坐标，两个矩形最小最大坐标即左上角和右下角坐标。判断两矩形是否相交，若矩形A的X最小值大于B的X的最大值，或A的Y最大值小于B的最小值，或A的Y最小值大于B的Y的最大值，或A的Y的最大值小于B的Y最大值，说明这两个矩形不相交，否则这两个矩形就是相交。

公式为：Axmin>Bxmax||Axmax<Bxmin||Aymin>Bymax||Aymax<Bymin

其中，Axmin＝ax1，Axmax＝ax3，Aymin＝ay1，Aymax＝ay3

Bxmin＝bx1，Bxmax＝bx3，Bymin＝by1，Bymax＝by3

因此，本发明根据获取注记配置所需的参数，采用矩形判断法对各个步骤中所有矩形框进行比较判断，得到判断结果。

S3、以候选注记位置i的最大范围作点要素j的最大外接矩形，自点要素集合Points、注记集合Label中筛选出与最大外接矩形相交的点要素数组PointM、注记数组LabelM。

如图4所示，所述步骤S3包括以下分步骤：

S31、以候选注记位置i的最大范围作点要素j的最大外接矩形，如图5所示；以最大外接矩形为筛选条件，使用矩形判断法自屏幕内点要素集合Points中筛选出外接矩形相交的点要素数组PointM。具体的，使用矩形判断法判断点要素集合Points中的点要素j是否与最大外接矩形相交，所述相交包括落入最大外接矩形范围内的点要素j，以及与最大外接矩形部分相交的点要素j，将与最大外接矩形相交的点要素j筛选出来并归集至一点要素数组PointM中。

S32、以最大外接矩形为筛选条件，使用矩形判断法自注记集合Label中筛选出与最大外接矩形相交的注记数组LabelM。具体的，使用矩形判断法判断注记集合Label中的注记位置i是否与最大外接矩形相交，所述相交包括落入最大外接矩形范围内的注记位置i，以及与最大外接矩形部分相交的注记位置i，将与最大外接矩形相交的注记位置i筛选出来并归集至一注记数组LabelM中。

具体的，步骤S2至步骤S3的工作流程示意图如图6所示。

S4、筛选出位于屏幕内的候选注记位置i，并根据点要素数组PointM、注记数组LabelM判断候选注记位置i范围内是否有点要素j或已标注其他注记，根据判断结果决定是否进行注记。

如图7所示，所述步骤S4包括以下分步骤：

S41、使用矩形判断法判断候选注记位置i是否位于屏幕内，如果候选注记位置i在屏幕内，则进行步骤S42的判断；

S42、使用矩形判断法判断点要素数组PointM中是否有点要素j位于候选注记位置i范围内，如果候选注记位置i范围内没有点要素j，则进行步骤S43的判断；

S43、使用矩形判断法判断注记数组LabelM中是否有注记位置i位于候选注记位置i范围内，如果候选注记位置i范围没有压盖已有注记位置i，则进行注记；反之，则不进行注记。

具体的，如图8所示，首先使用矩形判断法判断候选注记位置i是否位于屏幕内。如果候选注记位置i在屏幕内，则在按候选位置的先后顺序，即从正上方的第一候选位置开始，使用矩形判断法判断点要素数组PointM中是否有点要素j位于第一候选位置范围内，即在第一候选位置注记是否会压盖其他点要素j。如果有，则进行下一个候选位置的判断，如果没有，则继续判断注记数组LabelM中是否已经有注记设置在第一候选位置范围内，即在第一候选位置注记是否会压盖其他已有注记位置i。如果有，进行下一个候选位置的判断，如果没有，则可以将点要素j的注记放于该候选位置，并将该注记位置i坐标存入注记数组LabelM中。

使用矩形判断法依次对四个候选注记位置i进行位置判断，若四个方向都没有符合条件的候选注记位置i，则不进行注记，并进行下一个点要素j注记的配置。

选取几种特殊位置的点要素j，采用本发明所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法随机设置注记内容。效果如图9所示，

(1)多点距离近，但都有位置放注记，如图9中(a)所示；

(2)多点距离近，有点无位置放注记，如图9中(b)所示；

(3)有点靠近屏幕左右边缘，如图9中(c)所示，图中线条代表屏幕边缘；

(4)有点靠近屏幕上下边缘，如图9中(d)所示，图中线条代表屏幕边缘。

本发明所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法着重在浏览器中运行实现，能够在web界面进行应用，并使用web环境下绘制矢量图像有优势的HTML5canvas、javascript和css技术实现。

同时，本发明还提供一种基于浏览器进行复杂网络拓扑图点要素注记的绘制系统，所述基于浏览器进行复杂网络拓扑图点要素注记的绘制系统包括如下功能模块：

候选位置设置模块、用于以点要素j最小外接矩形为中心，在点要素j最小外接矩形的周围设置至少一个候选注记位置i；

集合筛选模块、用于获取注记配置所需的参数，筛选出位于屏幕内的点要素集合Points，及位于屏幕内的点要素j的注记集合Label；

数组筛选模块、用于以候选注记位置i的最大范围作点要素j的最大外接矩形，自点要素集合Points、注记集合Label中筛选出与最大外接矩形相交的点要素数组PointM、注记数组LabelM；

注记判断模块、用于根据点要素数组PointM、注记数组LabelM判断候选注记位置i范围内是否有点要素j或已标注其他注记，并根据判断结果决定是否进行注记。

其中，所述集合筛选模块包括以下功能子模块：

获取点要素j子模块、用于获取注记配置所需的参数，以屏幕坐标范围为筛选条件，使用矩形判断法自全部点要素j中筛选出位于屏幕内的点要素集合Points；

获取注记子模块、用于建立一注记集合Label，将根据点要素集合Points中的点要素j计算得到的注记位置i归集至注记集合Label中。

其中，所述数组筛选模块包括以下功能子模块：

筛选点要素j子模块、用于以最大外接矩形为筛选条件，使用矩形判断法自屏幕内点要素集合Points中筛选出与最大外接矩形相交的点要素数组PointM。

筛选注记子模块、用于以最大外接矩形为筛选条件，使用矩形判断法自注记集合Label中筛选出与最大外接矩形相交的注记数组LabelM。

其中，所述注记判断模块包括以下功能子模块：

位置判断子模块、用于使用矩形判断法判断候选注记位置i是否位于屏幕内，如果候选注记位置i在屏幕内，则过渡给点要素j判断子模块进行判断；

点要素j判断子模块、用于使用矩形判断法判断点要素数组PointM中是否有点要素j位于候选注记位置i范围内，如果候选注记位置i范围内没有点要素j，则过渡给注记判断子模块进行判断；

注记判断子模块、用于使用矩形判断法判断注记数组LabelM中是否有注记位置位于候选注记位置i范围内，如果候选注记位置i范围没有压盖其它注记位置，则进行注记；反之，则不进行注记。

本发明所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统，其通过在点要素j周围设置候选注记位置i，根据点要素j的实时位置变化，判断其周围是否有足够的位置用于设置注记，从而构建注记矩形动态避让模型，使所述注记位置i根据屏幕内点要素j的变化而变化，即经过一次计算得到的注记位置i并非最终注记位置i，只要点要素j在发生变化，不论全部点要素j整体放大、缩小、移动，或单独某个点要素j的移动、添加等操作，注记矩形动态避让模型就会重新获得点要素j在屏幕内的坐标数据，并将坐标数据重新载入模型进行注记位置i计算，则在重新计算后，可能使原本没有位置摆放注记的点要素j出现可以放注记的位置。

此外该技术通过筛选出位于屏幕内的点要素进行注记位置配置的方式针对时间效率进行优化，同时对屏幕内点要素j进行注记位置i配置，注记会自动避开屏幕边缘，因此不会出现注记的一部分位于屏幕外的情况。本发明所述基于浏览器进行复杂网络拓扑图点要素注记的绘制方法及系统既可以最大数量的将点要素j注记显示出来，还可以避免注记被屏幕边缘压盖出现混淆的情况。

以上装置实施例与方法实施例是一一对应的，装置实施例简略之处，参见方法实施例即可。

本说明书中各个实施例采用递进的方式描述，每个实施例重点说明的都是与其他实施例的不同之处，各个实施例之间相同相似部分互相参见即可。

专业人员还可以进一步意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能性一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应超过本发明的范围。

结合本文中所公开的实施例描述的方法或算法的步骤可以直接用硬件、处理器执行的软件模块，或者二者的结合来实施。软件模块可以置于随机储存器、内存、只读存储器、电可编程ROM、电可擦除可编程ROM、寄存器、硬盘、可移动磁盘、CD-ROM、或技术领域内所公知的任意其他形式的存储介质中。

上面结合附图对本发明的实施例进行了描述，但是本发明并不局限于上述的具体实施方式，上述的具体实施方式仅仅是示意性的，而不是限制性的，本领域的普通技术人员在本发明的启示下，在不脱离本发明宗旨和权利要求所保护的范围情况下，还可做出很多形式，这些均属于本发明的保护之内。