本技术涉及数据可视化,特别是涉及一种物理架构视图的自动布局方法、装置、计算机设备、存储介质和计算机程序产品。
背景技术:
1、数据可视化主要借助于图形化手段,清晰有效地传达与沟通信息。实现数据可视化的前端javascript(一种具有函数优先的轻量级、解释型或即时编译型的编程语言)类库主要有d3js(data-driven documents,一个可以基于数据来操作文档的javascript库)、go.js(一个开源的javascript图形库)、antv g6(一种图形绘制库)、highcharts(一种用纯javascript编写的图表库)、echarts(一种基于javascript的数据可视化图表库)等,这些类库默认支持的布局算法适用于特定场景。
2、目前缺少适用于物理架构视图的布局算法,传统的可视化前端类库没有适配的物理架构视图布局算法,不支持展示个性化节点图标,也不支持节点属性动态展示,可拓展性较差。
技术实现思路
1、基于此,有必要针对上述技术问题,提供一种能够支持展示个性化节点图标和节点属性动态展示的物理架构视图的自动布局方法、装置、计算机设备、计算机可读存储介质和计算机程序产品。
2、第一方面,本技术提供了一种物理架构视图的自动布局方法,包括:
3、基于浏览器的参数获取物理架构布局参数集;
4、根据物理架构布局参数集确定节点数组集,其中节点数组集包括父节点数组和子节点数组;
5、通过对节点数组集进行数据处理,获得节点数组坐标数据集;
6、根据节点数组集的调用关系渲染节点连线;
7、对节点数组集配置节点图标,并根据节点数组坐标数据集渲染节点图标;
8、间隔目标时间获取节点数组集的属性信息,并将节点数组集的属性信息更新至节点图标,生成物理架构视图。
9、在其中一个实施例中,通过对节点数组集进行数据处理,获得节点数组坐标数据集包括:
10、基于节点数组集确定首节点;
11、根据首节点和节点数组集中节点的层级确定节点的纵坐标;
12、根据节点数组集中节点数组的长度、节点在节点数组中的序号、目标节点的坐标确定节点的横坐标。
13、在其中一个实施例中,基于节点数组集确定首节点包括:
14、基于父节点数组的长度确定首节点,并获取首节点的层级和横坐标。
15、在其中一个实施例中,根据首节点和节点数组集中节点的层级确定节点的纵坐标包括:
16、从首节点开始递归定义目标子节点的层级;
17、在目标子节点的层级未定义的情况下,目标子节点的层级为目标父节点的层级加一,递归遍历目标子节点的子节点;在目标子节点的层级已定义、目标父节点的层级大于目标子节点的层级且目标父节点与目标子节点非双向节点的情况下,目标子节点的层级为目标父节点的层级加一,递归遍历目标子节点的子节点;
18、根据目标子节点的层级和层高获得节点的纵坐标。
19、在其中一个实施例中,根据节点数组集中节点数组的长度、节点在节点数组中的序号、目标节点的坐标确定节点的横坐标包括:
20、在目标子节点的横坐标未定义且只有单个目标父节点的情况下,根据目标父节点的横坐标、目标子节点在目标子节点数组中的序号和目标子节点数组的长度生成目标子节点的横坐标;
21、在目标子节点有两个目标父节点且两个目标父节点的子节点数组相同的情况下,根据目标父节点的横坐标、目标子节点在目标子节点数组中的序号和目标父节点在目标父节点数组中的序号生成目标子节点的横坐标;
22、在非目标子节点的横坐标未定义且只有单个目标父节点以及目标子节点有两个目标父节点且两个目标父节点的子节点数组相同的情况下,根据目标父节点的横坐标、目标父节点在目标父节点数组中的序号和目标子节点数组的长度生成目标子节点的横坐标;
23、在目标子节点生成前的横坐标与生成后的横坐标一致的情况下,退出递归调用;在目标子节点有子节点数组的情况下继续递归遍历目标子节点的子节点数组,否则递归遍历目标子节点的父节点的横坐标。
24、在其中一个实施例中,根据节点数组集中节点数组的长度、节点在节点数组中的序号、目标节点的坐标确定节点的横坐标还包括:
25、在目标父节点的横坐标未定义且只有单个目标子节点的情况下,根据目标子节点的横坐标、目标父节点在目标父节点数组中的序号和目标父节点数组的长度生成目标父节点的横坐标;
26、在目标父节点有两个目标子节点且两个目标子节点的父节点数组相同的情况下,根据目标子节点的横坐标、目标父节点在目标父节点数组中的序号和目标子节点在目标子节点数组中的序号生成目标父节点的横坐标;
27、在非目标父节点的横坐标未定义且只有单个目标子节点以及目标父节点有两个目标子节点且两个目标子节点的父节点数组相同的情况下,根据目标子节点的横坐标、目标子节点在目标子节点数组中的序号和目标父节点数组的长度生成目标父节点的横坐标;
28、在目标父节点生成后的横坐标与生成前的横坐标一致的情况下,退出递归调用;在目标父节点有父节点数组的情况下继续递归遍历目标父节点的父节点数组,否则递归遍历目标父节点的子节点的横坐标。
29、第二方面,本技术还提供了一种物理架构视图的自动布局装置,包括:
30、物理架构布局参数集获取模块,用于基于浏览器的参数获取物理架构布局参数集;
31、节点数组集获取模块,用于根据物理架构布局参数集确定节点数组集,其中节点数组集包括父节点数组和子节点数组;
32、节点数组坐标数据集获取模块,用于通过对节点数组集进行数据处理,获得节点数组坐标数据集;
33、节点连线渲染模块,用于根据节点数组集的调用关系渲染节点连线;
34、节点图标渲染模块,用于对节点数组集配置节点图标,并根据节点数组坐标数据集渲染节点图标;
35、属性信息更新模块,用于间隔目标时间获取节点数组集的属性信息,并将节点数组集的属性信息更新至节点图标,生成物理架构视图。
36、第三方面,本技术还提供了一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,所述处理器执行所述计算机程序时实现以下步骤:
37、基于浏览器的参数获取物理架构布局参数集;
38、根据物理架构布局参数集确定节点数组集,其中节点数组集包括父节点数组和子节点数组;
39、通过对节点数组集进行数据处理,获得节点数组坐标数据集;
40、根据节点数组集的调用关系渲染节点连线;
41、对节点数组集配置节点图标,并根据节点数组坐标数据集渲染节点图标;
42、间隔目标时间获取节点数组集的属性信息,并将节点数组集的属性信息更新至节点图标,生成物理架构视图。
43、第四方面,本技术还提供了一种计算机可读存储介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现以下步骤:
44、基于浏览器的参数获取物理架构布局参数集;
45、根据物理架构布局参数集确定节点数组集,其中节点数组集包括父节点数组和子节点数组;
46、通过对节点数组集进行数据处理,获得节点数组坐标数据集;
47、根据节点数组集的调用关系渲染节点连线;
48、对节点数组集配置节点图标,并根据节点数组坐标数据集渲染节点图标;
49、间隔目标时间获取节点数组集的属性信息,并将节点数组集的属性信息更新至节点图标,生成物理架构视图。
50、第五方面,本技术还提供了一种计算机程序产品,包括计算机程序,该计算机程序被处理器执行时实现以下步骤:
51、基于浏览器的参数获取物理架构布局参数集;
52、根据物理架构布局参数集确定节点数组集,其中节点数组集包括父节点数组和子节点数组;
53、通过对节点数组集进行数据处理,获得节点数组坐标数据集;
54、根据节点数组集的调用关系渲染节点连线;
55、对节点数组集配置节点图标,并根据节点数组坐标数据集渲染节点图标;
56、间隔目标时间获取节点数组集的属性信息,并将节点数组集的属性信息更新至节点图标,生成物理架构视图。
57、上述物理架构视图的自动布局方法、装置、计算机设备、存储介质和计算机程序产品,通过基于浏览器的参数获取物理架构布局参数集;根据物理架构布局参数集确定节点数组集,其中节点数组集包括父节点数组和子节点数组;通过对节点数组集进行数据处理,获得节点数组坐标数据集;根据节点数组集的调用关系渲染节点连线;对节点数组集配置节点图标,并根据节点数组坐标数据集渲染节点图标;间隔目标时间获取节点数组集的属性信息,并将节点数组集的属性信息更新至节点图标,生成物理架构视图,使用d3js开发物理架构视图自动布局算法,能够根据节点调用关系自动生成物理架构视图,实现节点分层展示、对称分布,物理架构视图可以展示个性化节点图标和实时动态展示节点属性信息。