CN110909220A - 拓扑可视化方法及装置 - Google Patents

Abstract

本发明提供了一种拓扑可视化方法及装置，该方法包括：获取拓扑对象信息；拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数；标识参数是拓扑对象的唯一标识；配置参数用于配置拓扑对象的属性；根据标识参数将拓扑对象信息转化为视图对象数据；根据绘图数据、视图对象数据和配置参数生成拓扑图。本发明通过简单的数据配置，即可高效地生成拓扑关系图。

Description

拓扑可视化方法及装置

技术领域

本发明涉及计算机技术领域，尤其是涉及一种拓扑可视化方法及装置。

背景技术

拓扑结构是引用拓扑学中研究与大小、形状无关的点、线关系的方法，把网络中的计算机和通信设备抽象为一个点，把传输介质抽象为一条线，由点和线组成的几何图形就是计算机网络的拓扑结构。为了实现运营商设备间互联关系的展示需求，可以以拓扑关系图的方式表示设备间的拓扑结构。现有生成拓扑关系图的方案，效率有待提高。

发明内容

本发明提供了一种拓扑可视化方法及装置，可以通过简单的数据配置，高效地生成拓扑关系图。

第一方面，本发明实施例提供了一种拓扑可视化方法，该方法包括：获取拓扑对象信息；所述拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数；所述标识参数是所述拓扑对象的唯一标识；所述配置参数用于配置拓扑对象的属性；根据所述标识参数将所述拓扑对象信息转化为视图对象数据；根据绘图数据、所述视图对象数据和所述配置参数生成拓扑图。

第二方面，本发明实施例还提供一种拓扑可视化装置，该装置包括：获取模块，用于获取拓扑对象信息；所述拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数；所述标识参数是所述拓扑对象的唯一标识；所述配置参数用于配置拓扑对象的属性；转化模块，用于根据所述标识参数将所述拓扑对象信息转化为视图对象数据；生成模块，用于根据绘图数据、所述视图对象数据和所述配置参数生成拓扑图。

第三方面，本发明实施例还提供一种计算机设备，包括存储器、处理器，所述存储器中存储有可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述拓扑可视化方法。

第四方面，本发明实施例还提供一种具有处理器可执行的非易失的程序代码的计算机可读介质，所述程序代码使所述处理器执行上述拓扑可视化方法。

本发明实施例带来了以下有益效果：本发明实施例提供了一种拓扑可视化方案，该方案首先获取用户提供的拓扑对象信息，拓扑对象信息中至少包括拓扑对象的标识参数和拓扑对象的配置参数，其中，标识参数是拓扑对象的唯一标识，用于识别拓扑对象的身份，配置参数用于配置拓扑对象的各种属性；根据标识参数将拓扑对象信息转化为视图对象数据，通过转化，使拓扑对象信息被定义为能够被浏览器识别的视图对象数据；最后，根据绘图数据、视图对象数据和配置参数可以生成拓扑图。本发明实施例通过简单的数据配置，即可高效地生成拓扑关系图。

本发明的其他特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本发明而了解。本发明的目的和其他优点在说明书、权利要求书以及附图中所特别指出的结构来实现和获得。

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

附图说明

为了更清楚地说明本发明具体实施方式或现有技术中的技术方案，下面将对具体实施方式或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施方式，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的拓扑可视化方法流程图；

图2为本发明实施例提供的拓扑可视化方法综合使用呈现全功能示意图；

图3为本发明实施例提供的拓扑可视化方法基础使用呈现点线组示意图；

图4为本发明实施例提供的拓扑可视化装置结构框图；

图5为本发明实施例提供的计算机设备结构框图。

具体实施方式

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

为了实现运营商设备间互联关系的展示需求，以及越来越高的性能和美观度要求，我们需要设计出一套完整的、通用的前端展示化组件来支持。通过更加简单的数据配置，更加高效、美观的绘制出拓扑关系图，并可以自定义定制鼠标事件来响应对应的功能。

基于此，本发明实施例提供的一种拓扑可视化方法及装置，可以高效、美观的展示出事物间的逻辑关系。

为便于对本实施例进行理解，首先对本发明实施例所公开的一种拓扑可视化方法进行详细介绍。

本发明实施例提供了一种拓扑可视化方法，参见图1所示的一种拓扑可视化方法流程图，该方法包括以下步骤：

步骤S102，获取拓扑对象信息。

在本发明实施例中，拓扑对象信息是用户提供的想要得到的拓扑图中的图元信息。拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数，其中，标识参数是拓扑对象的唯一标识，用于确定拓扑对象的身份，配置参数可以确定拓扑对象的属性信息。例如，属性信息可以为位置、颜色、文字、高亮、动画效果等。

步骤S104，根据标识参数将拓扑对象信息转化为视图对象数据。

在本发明实施例中，为了便于系统识别拓扑对象信息，可以根据标识参数将拓扑对象信息转化为视图对象数据，即将拓扑对象信息进行数据计算和存储，得到能够为浏览器识别的数据结构。

步骤S106，根据绘图数据、视图对象数据和配置参数生成拓扑图。

在本发明实施例中，绘图数据是预先设置的数据结构，可以用于实现绘制点、线、组，可以用于实现绘制点线动画效果，点的闪烁，线的闪烁高亮，点线焦点高亮等；还可以用于实现事件封装方法，点线点击，全局拖拽，放大缩小。

在得到了绘图数据、视图对象数据和配置参数之后，可以调用绘图组件进行绘图，以得到拓扑图。

需要说明的是，上述绘图组件可以为canvas组件。组件封装是前端web浏览器使用的工具，所以执行过程表现在浏览器端。浏览器会基于用户提供的配置数据，在内存中计算，数据存储，然后再使用canvas进行绘图，通过数据结构改变绘图方法，实现拓扑功能。

本发明实施例，可以在极大程度上缓解浏览器绘图的压力，增大绘图效率，例如，秒级能绘制10000个图元数据。

本发明实施例提供了一种拓扑可视化方案，该方案首先获取用户提供的拓扑对象信息，拓扑对象信息中至少包括拓扑对象的标识参数和拓扑对象的配置参数，其中，标识参数是拓扑对象的唯一标识，用于识别拓扑对象的身份，配置参数用于配置拓扑对象的各种属性；根据标识参数将拓扑对象信息转化为视图对象数据，通过转化，使拓扑对象信息被定义为能够被浏览器识别的视图对象数据；最后，根据绘图数据、视图对象数据和配置参数调用画图软件以生成拓扑图。本发明实施例通过简单的数据配置，即可高效地生成拓扑关系图。

考虑到为了缓解浏览器绘图的压力，增大绘图效率，根据标识参数将拓扑对象信息转化为视图对象数据，可以按照如下步骤执行：

根据标识参数将拓扑对象信息确定为点数据、线数据或组数据；组数据中包括一个或多个点数据，并且多个点数据对应同一个父对象；将点数据、线数据和组数据作为视图对象数据。

在本发明实施例中，拓扑对象信息中可以包括点对象、线对象和组对象。其中，点对象通过点数据进行存储和处理，线对象通过线数据进行存储和处理，组对象通过组数据进行存储和处理。组数据由一个或多个点数据构成，一个组中的多个点数据对应同一个父对象。

将点数据、线数据和组数据作为视图对象数据，视图对象数据可以确定图元信息的身份及图元信息之间的关系。

为了提高数据计算效率，根据标识参数将拓扑对象信息确定为点数据、线数据或组数据，可以按照如下步骤执行：

若标识参数为点标识参数，则将点对象信息添加至点集合以生成点数据；若标识参数为线标识参数，且存在双端点，则将线对象信息添加至点集合以生成线数据；若标识参数为组标识参数，则将组对象信息添加至组集合以生成组数据。

标识参数可以包括点对象参数、线对象参数和组对象参数。

参见表1，点对象参数可以确定点的父id以及默认事件等属性：

表1

参见表2，线对象参数可以确定线的起始点id、线的结束点id以及线的颜色配置等属性：

表2

参见表3，组对象参数可以确定组的父id以及默认事件等属性：

表3

在本发明实施例中，在增加点的过程中，如果拓扑对象信息中标识参数是点标识参数，则确定该拓扑对象信息为点对象，将该点对象信息添加到所有点的集合当中，并存储到对应缓存中。数据处理完成之后，按照指定配置参数计算点的大小、位置、颜色、图片、绑定图标、动画效果生成对应的视图对象，使用canvas绘图。

在增加线的过程中，如果拓扑对象信息中标识参数是线标识参数，则确定该拓扑对象信息为线对象，判断线对象的双端点是否存在，若存在则加入线，以双端点id记录点线关系，将该线对象信息添加到所有线的集合当中，存储到对应缓存中。数据处理完成之后生成对应的线视图，按照指定配置参数计算线的颜色、宽度、曲度、绑定图标、对应的动画效果等生成对应的视图对象，使用canvas绘图。

在增加组的过程中，如果拓扑对象信息中标识参数是组标识参数，则确定该拓扑对象信息为组对象，将该组对象信息添加到所有组的集合当中，并存储到对应缓存中。

考虑到组数据中增加点的需求，若标识参数为点标识参数，则将点标识参数添加至点集合以生成点数据，可以按照如下步骤执行：

根据点标识参数判断点对象是否存在父对象；若存在，存储父对象的信息；将存在父对象的点数据添加至相应的组数据。

在本发明实施例中，通过标识参数可以确定拓扑对象的多种属性，当拓扑对象为点对象，可以根据该点对象的标识参数，即点标识参数，确定该点对象是否存在父对象，点对象继承了父对象的部分属性。若点对象存在父对象，则存储父对象的信息，并将存在父对象的点数据添加至相应的组数据，实现对组数据中点数据的补充。

在得到拓扑图之后，为了优化显示效果，以便于用户获取拓扑图信息，该方法还可以包括如下步骤：

提取并显示点数据、线数据、组数据和点线关系数据其中之一或任意组合。

在本发明实施例中，点线关系数据包括，例如，基于点数据，确定与点对象相关联的线对象；基于线数据，确定与线对象相关联的点对象。又例如，根据点线关系，可以获取到与当前点对象相关联的线的对端的点数据；根据点线关系，获取相互关联的线；获取单个点，或者根据点的父子关系，可以获取点的孩子或者父亲。

在得到拓扑图之后，为了便于用户对拓扑图进行操作，该方法还可以包括如下步骤：

在拓扑对象的配置参数中增加事件对象参数；事件对象参数用于确定事件的处理方式。

在本发明实施例中，事件参数可以用于确定事件的处理方式，例如，对每一种拓扑对象都可以配置各自的鼠标单击、双击事件。

还可以通过配置事件参数实现右键菜单，鼠标滑过事件统一处理，图例，全局事件等事件。通过事件参数确定事件的处理方式如下：

a)菜单：右键点击不同的图元，可以判断所点击图元的属性触发不同的方法进而生成不同的菜单选项。和鼠标滑过文字提示功能不冲突，点击之后不会触发该事件。

b)鼠标滑过文字提示：配置默认鼠标滑过事件，监听图元对象，当鼠标滑动至指定图元，可同步展示图元属性，或者异步展示图元其他详细属性。

c)图例：通过不同的配置在指定位置生成对应可拖拽扩展的图例对象。

d)全局事件：i.全局拖拽；ii.全局缩放；iii.图元焦点事件(鼠标停留于某一图元，会高亮显示与其有关联的图元进行展示，根据数据存储，配置鼠标滑过事件，当停留于某一图元时，自动计算与之相关联的图元对象集合，高亮对应图元对象)。

参见表4，可以在获取拓扑对象信息时获取事件对象属性信息：

表4

本发明实施例可以对数据结构进行封装，得到通用性更高的组件，该组件在更多的场景下都可以使用，本发明实施例除了可以绘制运营商设备连接关系，亦可以绘制只要是和拓扑沾边的效果图。而且，都是可以自定义的。该组件可以设置对外暴露的数据接口，以实现如下功能：

1.增加点，增加线，增加组。

2.获取点，获取线，获取与点相关联的点，相关联的线。

3.修改图元(点、线、组)上的图形对象。

4.获取绘图区域大小，计算图形位置坐标，自动排列算法(基于中心点排列成圆)。

5.图片导出(用来获取绘制的图片方便截图)。

上述数据结构及算法核心成果文件，生成ucharts.min.js发布使用。

参见图2所示的拓扑可视化方法综合使用呈现全功能示意图，其中，点对象5和点对象6属于同一个组对象，点对象3和点对象7属于同一个组对象，点对象1和点对象2属于同一个组对象。另外，点对象5和点对象6所在的组对象属于点对象3和点对象7所在的组对象，点对象3和点对象7所在的组对象属于点对象1和点对象2所在的组对象。通过确定点对象与点对象之间的父子关系，可以得到多个点对象之间的关系。该图展示了设置图例，增加点(可拖拽点，不可拖拽点，点高亮效果)、组(大组包小组，小组拖拽大组变化，点拖拽组变化线变化等)，增加线(弯曲度，线上状态，线的闪烁，线不同颜色，线上动画小球)。

参见图3所示的拓扑可视化方法基础使用呈现点线组示意图，该图为最基础使用实现，生产两个点一个组，点上配置不可拖动，高亮闪烁，线上你配置弯曲、颜色动画小球、文字、线上图标状态。具体过程如下：

1.初始化拓扑对象。dom指定绘图div，roam表示是否可缩放，legend配置图例，click、onclick配置事件。ucharts.init({})

2.生成点线组。ucharts.Point，logictopo.Link，logictopo.Group.

3.增加点线组。ucharts.addPoint()，logictopo.addLink()；

具体可以参考如下代码:

本发明实施例提供了一种拓扑可视化方法，该方法基于前端Canvas绘图机制，运用模块化编程的方式，通过完整的数据结构将图元(点)、连接关系(线)、父子关系(组)进行统一存储，实现拓扑基本功能增加点、增加线、处理点线关系、点与点之间的关系，通过内存计算实现点线联动、点组联动。同时基于绘图机制实现事件封装，图像展示以及动画效果。最终将绘图对象和内存结构相关联绑定，实现数据与图像的关联，从而实现拓扑组件。该方法前端绘图可以支持万级数量绘制不卡顿，支持多种绘制拓扑场景，并且核心算法轻量易用。

本发明实施例还提供一种拓扑可视化装置，参见图4所示的拓扑可视化装置结构框图，该装置包括：

获取模块71，用于获取拓扑对象信息；拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数；标识参数是拓扑对象的唯一标识；配置参数用于配置拓扑对象的属性；转化模块72，用于根据标识参数将拓扑对象信息转化为视图对象数据；生成模块73，用于根据绘图数据、视图对象数据和配置参数生成拓扑图。

在一个实施例中，转化模块，具体用于：根据标识参数将拓扑对象信息确定为点数据、线数据或组数据；组数据中包括一个或多个点数据，并且多个点数据对应同一个父对象；将点数据、线数据和组数据作为视图对象数据。

在一个实施例中，转化模块，具体用于：若标识参数为点标识参数，则将点对象信息添加至点集合以生成点数据；若标识参数为线标识参数，且存在双端点，则将线对象信息添加至线集合以生成线数据；若标识参数为组标识参数，则将组对象信息添加至组集合以生成组数据。

在一个实施例中，转化模块，具体用于：根据点标识参数判断点对象是否存在父对象；若存在，存储父对象的信息；将存在父对象的点数据添加至相应的组数据。

在一个实施例中，该装置还包括提取模块，用于：提取并显示点数据、线数据、组数据和/或点线关系数据。

在一个实施例中，该装置还包括括事件模块，用于：在拓扑对象的配置参数中增加事件对象参数；事件对象参数用于确定事件的处理方式。

本发明实施例还提供一种计算机设备，参见图5所示的计算机设备结构示意框图，该计算机设备包括存储器81、处理器82，存储器中存储有可在处理器上运行的计算机程序，处理器执行计算机程序时实现上述任一种方法的步骤。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的计算机设备的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述

本发明实施例还提供一种具有处理器可执行的非易失的程序代码的计算机可读介质，程序代码使处理器执行上述任一种方法的步骤。

本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本发明是参照根据本发明实施例的方法和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

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

Claims (11)

1.一种拓扑可视化方法，其特征在于，包括：

获取拓扑对象信息；所述拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数；所述标识参数是所述拓扑对象的唯一标识；所述配置参数用于配置拓扑对象的属性；

根据所述标识参数将所述拓扑对象信息转化为视图对象数据；

根据绘图数据、所述视图对象数据和所述配置参数生成拓扑图。

2.根据权利要求1所述的拓扑可视化方法，其特征在于，根据所述标识参数将所述拓扑对象信息转化为视图对象数据，包括：

根据所述标识参数将所述拓扑对象信息确定为点数据、线数据或组数据；所述组数据中包括一个或多个点数据，并且所述多个点数据对应同一个父对象；

将所述点数据、所述线数据和所述组数据作为视图对象数据。

3.根据权利要求2所述的拓扑可视化方法，其特征在于，根据所述标识参数将所述拓扑对象信息确定为点数据、线数据或组数据，包括：

若所述标识参数为点标识参数，则将点对象信息添加至点集合以生成点数据；

若所述标识参数为线标识参数，且存在双端点，则将线对象信息添加至线集合以生成线数据；

若所述标识参数为组标识参数，则将组对象信息添加至组集合以生成组数据。

4.根据权利要求3所述的拓扑可视化方法，其特征在于，若所述标识参数为点标识参数，则将点对象信息添加至点集合以生成点数据，还包括：

根据所述点标识参数判断点对象是否存在父对象；

若存在，存储所述父对象的信息；

将存在父对象的点数据添加至相应的组数据。

5.根据权利要求2所述的拓扑可视化方法，其特征在于，还包括：

提取并显示所述点数据、所述线数据、所述组数据和点线关系数据其中之一或任意组合。

6.根据权利要求1-5任一项所述的拓扑可视化方法，其特征在于，还包括：

在所述拓扑对象的配置参数中增加事件对象参数；所述事件对象参数用于确定事件的处理方式。

7.一种拓扑可视化装置，其特征在于，包括：

获取模块，用于获取拓扑对象信息；所述拓扑对象信息至少包括拓扑对象的标识参数和拓扑对象的配置参数；所述标识参数是所述拓扑对象的唯一标识；所述配置参数用于配置拓扑对象的属性；

转化模块，用于根据所述标识参数将所述拓扑对象信息转化为视图对象数据；

生成模块，用于根据绘图数据、所述视图对象数据和所述配置参数生成拓扑图。

8.根据权利要求7所述的拓扑可视化装置，其特征在于，还包括提取模块，用于：

提取并显示点数据、线数据、组数据和点线关系数据其中之一或任意组合。

9.根据权利要求7所述的拓扑可视化装置，其特征在于，还包括事件模块，用于：

在所述拓扑对象的配置参数中增加事件对象参数；所述事件对象参数用于确定事件的处理方式。

10.一种计算机设备，包括存储器、处理器，所述存储器中存储有可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现上述权利要求1至6任一项所述的方法的步骤。

11.一种具有处理器可执行的非易失的程序代码的计算机可读介质，其特征在于，所述程序代码使所述处理器执行上述权利要求1至6任一项所述的方法。

Images