实现数据结构可视化的方法、装置和电子设备制造方法及图纸

技术编号:18444990 阅读:21 留言:0更新日期:2018-07-14 10:24
本申请实施例公开一种实现数据结构可视化的方法、装置和电子设备,该方法包括:对关系型数据结构进行处理得到节点集合和边集合;基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。

Method, device and electronic device for realizing data structure visualization

The present application embodiment discloses a method, a device and an electronic device for realizing the visualization of a data structure. The method includes: processing the relational data structure to get the set of nodes and the set of edges; based on the degree of the node in the set of the nodes, the layout side in the set of the sides is determined, and the layout side is required. The edge of the position of the corresponding graph in the canvas is determined during the layout process; a visual pattern related to the relational data structure is presented to the user based on the nodes in the set of nodes and the side of the layout.

【技术实现步骤摘要】
实现数据结构可视化的方法、装置和电子设备
本申请涉及信息可视化领域,更具体地涉及实现数据结构可视化的方法、装置和电子设备。
技术介绍
目前在通常采用D3.js和可缩放矢量图形(ScalableVectorGraphics,SVG)在前端实现关系型数据结构的图形化展示及渲染。这种实现方式中,首先在后台将关系型数据结构经过一定的业务逻辑处理后,将关系型数据结构转换为节点和边的集合。之后通过异步或同步的方式将数据加载到前端,并通过D3重力图的方式对节点和边的数据进行初始化。然后通过SVG的画布功能和画图功能,将点和边生成相应的图形,渲染并呈现在浏览器端。最后通过D3重力图布局算法(迭代计算),将节点和边的相应图形分布在画布中的合适位置,最终将关系型数据呈现为一张形如网络结构的图形。但是,在大数据场景下,由于数据量很大,采用现有技术的上述方法将会导致关系型数据结构的图形在前端页面布局需要很长的时间甚至无法成功布局的问题,影响关系型数据结构的可视化效率。因此,需求一种实现数据结构可视化的方法,来克服上述技术问题。
技术实现思路
本申请的目的在于提供一种实现数据可视化的方法、装置和电子设备,能够降低关系型数据结构的图形在前端页面布局所需时间,提高关系型数据结构的可视化效率。为解决上述技术问题,本申请实施例是这样实现的:第一方面,提供了一种实现数据结构可视化的方法,包括:对关系型数据结构进行处理得到节点集合和边集合;基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。第二方面,提供一种实现数据结构可视化的装置,包括:第一处理单元,对关系型数据结构进行处理得到节点集合和边集合;第二处理单元,基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;图形显示单元,基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。第三方面,提供一种电子设备,包括:处理器;以及被安排成存储计算机可执行指令的存储器,所述可执行指令在被执行时使用所述处理器执行以下操作:对关系型数据结构进行处理得到节点集合和边集合;基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。第四方面,提供一种计算机可读介质,所述计算机可读介质存储一个或多个程序,所述一个或多个程序当被包括多个应用程序的电子设备执行时,使得所述电子设备执行以下操作:对关系型数据结构进行处理得到节点集合和边集合;基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。由以上本申请实施例提供的技术方案可见,本申请实施例基于关系型数据结构处理得到的节点集合中的节点的出度,确定关系型数据结构处理得到的边集合中的待布局边,并基于节点集合中的节点和待布局边,向用户呈现关系型数据结构相关的可视化图形,其中,待布局边为需要在布局过程中确定相应的图形在画布中的位置的边,即在布局过程中只需要将所有节点相应的图形以及待布局边相应的图形布局在画布中,不需将所有节点相应的图形和所有边相应的图形全部布局在画布中,能够在数据量较大时实现图形位置的快速布局,降低关系型数据结构的图像在前端页面布局所需时间,提高关系型数据结构的可视化效率。附图说明为了更清楚地说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请中记载的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。图1是根据本申请的一个实施例的实现数据结构可视化的方法的示意性流程图。图2是根据本申请一个实施例的确定待布局边的方法的示意图。图3是根据本申请一个实施例的Map结构的示意图。图4是根据本申请一个实施例的全局缩略图的示意图。图5是根据本申请一个实施例的子图的示意图。图6是根据本申请一个具体实施例的构建Map结构的方法的示意图。图7是根据本申请一个具体实施例的生成全局缩略图的方法的示意图。图8是根据本申请一个实施例的生成子图的方法的示意图。图9是根据本申请实施例的电子设备的结构框图。图10是根据本申请实施例的实现数据结构可视化的装置的结构示意图。具体实施方式为了使本
的人员更好地理解本申请中的技术方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。图1是根据本申请的一个实施例的实现数据结构可视化的方法的流程图。图1的方法由实现数据结构可视化的装置执行。如图1所示出的,在S102处,对关系型数据结构进行处理得到节点集合和边集合。具体地,节点集合中的节点中的数据包括:节点的属性值、节点的唯一标识ID、节点的元数据信息。边集合中的边中的数据包括:源节点ID、目标节点ID、边属性、边的元数据信息。可选地,节点集合中的点和边集合中的边采用列表结构存储数据。可以理解的是,在S102处,对关系型数据结构进行处理得到节点集合和边集合,实质上是将关系型数据结构转换为包括节点集合和边集合的数据结构。在S104处,基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边。需要说明的是,本申请实施例中的布局过程指的是通过布局算法(例如,D3重力图布局算法),确定节点相应的图形和边相应的图形在画布中的位置的过程,即通过布局算法将节点相应的图形和边相应的图形分布在画布中的合适位置的过程。可以理解的是,本申请实施例中的边集合中除待布局边之外的其他边不需要在布局过程中确定相应的图形在画布中的位置,这些处待布局边之外的边可以在完成对节点相应的图形和待布局边相应的图形的布局之后,直接在画布中画出来。可选地,在一些实施例中,基于节点集合中的节点的出度,确定所述边集合中的待布局边,包括:对于所述节点集合中相关联的任意两个节点,如果所述两个节点中至少一个节点的出度大于或等于出度阈值,则将所述两个节点中出度较小的节点与其他节点之间的边作为裁剪边集合中的边;将所述边集合中除所述裁剪边集合中的边之外的边确定为所述待布局边。采用这种方式确定待布局边能够使得最终呈现的图形整体呈现为多中心点的聚类图像,方便用户进行聚类分析。可选地,在另一些实施例中,基于节点集合中的节点的出度,确定所述边集合中的待布局边,包括:对所述节点集合中相关联的任意两个节点。如果所述两个节点的出度均小于或等于出度阈值,则将所述两个节点之间的边确定为所本文档来自技高网
...

【技术保护点】
1.一种实现数据结构可视化的方法,包括:对关系型数据结构进行处理得到节点集合和边集合;基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。

【技术特征摘要】
1.一种实现数据结构可视化的方法,包括:对关系型数据结构进行处理得到节点集合和边集合;基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,所述待布局边为需要在布局过程中确定相应的图形在画布中的位置的边;基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形。2.根据权利要求1所述的方法,所述基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,包括:对于所述节点集合中相关联的任意两个节点,如果所述两个节点中至少一个节点的出度大于或等于出度阈值,则将所述两个节点中出度较小的节点与其它节点之间的边作为裁剪边集合中的边;将所述边集合中除所述裁剪边集合中的边之外的边确定为所述待布局边。3.根据权利要求1所述的方法,所述基于所述节点集合中的节点的出度,确定所述边集合中的待布局边,包括:对于所述节点集合中相关联的任意两个节点,如果所述两个节点的出度均小于或等于出度阈值,则将所述两个节点之间的边确定为所述待布局边的一部分;以及,对于所述节点集合中相关联的任意两个节点,如果所述两个节点中至少一个节点的出度大于或等于所述出度阈值,则将所述两个节点中出度较大的节点与其它节点之间的边确定为所述待布局边的一部分。4.根据权利要求2所述的方法,所述基于所述节点集合中的节点和所述待布局边,向用户呈现所述关系型数据结构相关的可视化图形,包括:基于所述节点集合中的节点和所述待布局边,生成全局缩略图,所述全局所略图中包括有边界的可伸缩矢量图形SVG画布、布局在所述有边界的SVG画布中的所述节点集合中的节点相应的图形和可移动的选择框,所述可移动的选择框用于用户选择所述节点集合中的节点中的至少一个目标节点;向用户呈现所述全局缩略图。5.根据权利要求4所述的方法,还包括:根据所述节点集合和所述边集合,确定点映射集Map、边Map和图索引,其中,所述点Map用于以键值对的形式存储所述节点集合中的节点中的数据,所述边Map用于以键值对的形式存储所述边集合中的边中的数据,所述图索引用于以键值对的形式存储所述节点集合中的节点的标识、节点的出度、节点的入度、节点的被关联点的标识以及与所述裁剪边集合中的边相关的节点的标识;其中,在基于所述节点集合中的节点的出度,确定所述边集合中的待布局边之前,还包括:根据所述图索引确定所述节点集合中相关联的任意两个节点的出度。6.根据权利要求5所述的方法,所述基于所述节点集合中的节点和所述待布局边,生成全局缩略图,包括:基于所述图索引从所述点Map中获取所述点集合中的节点中的数据;基于所述图索引从所述边Map中获取所述待布局边中的数据;基于所述节点集合中的节点中的数据和所述待布局边中的数据,生成所述全局缩略图。7.根据权利要求6所述的方法,所述基于所述节点集合中的节点中的数据和所述待布局边中的数据,生成所述全局缩略图,包括:基于所述节点集合中的节点中的数据,生成所述节点集合中的节点相应的图形;基于所述待布局边中的数据,生成所述待布局边相应的图形;将所述节点集合中的节点相应的图形和所述待布局边相应的图形布局在所述有边界的SVG画布中的相应位置;基于所述节点集合中的节点相应的图形和所述待布局边相应的图形在所述有边界的SVG画布中的位置,生成所述全局缩略图。8.根据权利要求7所述的方法,在基于所述节点集合中的数据,生成所述节点集合中的节点相应的图形之后,还包括:基于所述节点集合中的节点中的数据,渲染所述节点集合中的节点相应的图形。9.根据权利要求5至8中任一项所述的方法,还包括:基于用户通过所述可移动的选择框选择的至少一个目标节点的标识和所述图索引,确定所述节点集合中的节点中需要在子图中呈现给用户的节点;基于所述至少一个目标节点的标识和所述图...

【专利技术属性】
技术研发人员:王建国
申请(专利权)人:阿里巴巴集团控股有限公司
类型:发明
国别省市:开曼群岛,KY

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1