一种前端的多重数据图表组件实现方法技术

本发明专利技术公开了一种前端的多重数据图表组件实现方法

【技术实现步骤摘要】
一种前端的多重数据图表组件实现方法、存储介质及设备


[0001]本专利技术涉及数据处理领域，具体涉及一种前端的多重数据图表组件实现方法
、
存储介质及设备
。

技术介绍

[0002]科学技术的发展推动着前端工作者工作职责及技术要求的不断提升，前端开发也朝着更加灵活和交互性更强的方向推进
。
为了更清晰直观地将信息呈现于大众面前，对多重数据的展示大都采用了图表的形式
。
现有的图表主流展现形式大致可以分为以下二种类型，第一种类型是折线图或柱状图，第二种类型是饼状图或环形图
。
[0003]但是，对于折线图或柱状图而言，其仅能展示特定数量的数据，随着数据量的增多，图中横轴节点数依次递增，图表内容会显得格外拥挤，影响展示效果；对于饼状图或环形图而言，其很难直观的展示各数据的详细信息及数据总量
。
可见，当前的图标展示方式皆受展示区域范围限制，在固定范围内，所能展示信息量极为有限，难以满足多数据场景下的信息呈现需求
。
专利技术内容
[000本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.
一种前端的多重数据图表组件实现方法，其特征在于，具体包括以下步骤：配置组件中核心单元
、
核心单元的轨道，以及围绕核心单元并在所述轨道上运动的卫星单元的初始信息；基于传入组件的数据集合的数据信息，确定轨道数量
、
单条轨道上卫星单元数量和卫星单元尺寸，投放对应卫星单元至对应轨道；对卫星单元进行立体视觉设置，并添加动画效果以使核心单元轨道上的卫星单元围绕核心单元运动
。2.
如权利要求1所述的一种前端的多重数据图表组件实现方法，其特征在于，所述配置组件中核心单元
、
核心单元的轨道，以及围绕核心单元并在所述轨道上运动的卫星单元的初始信息，具体为：对组件中核心单元的宽度
、
核心单元四周的轨道数量
、
单条轨道上的最大卫星单元数量
、
卫星单元的最大和最小宽度
、
卫星单元的最大数量进行初始设置；获取组件容器宽度，根据组件容器宽度和设置的核心单元宽度，计算得到核心单元所处位置以及核心单元四周轨道间的间隔
。3.
如权利要求2所述的一种前端的多重数据图表组件实现方法，其特征在于，所述基于传入组件的数据集合的数据信息，确定轨道数量
、
单条轨道上卫星单元数量和卫星单元尺寸，投放对应卫星单元至对应轨道，具体步骤包括：传入数据集合至组件，根据数据集合中数据的个数以及设置的单条轨道上的最大卫星单元数量，确定实际需要的轨道数量
、
轨道间间隔和每条轨道上的卫星单元数量；根据确定的轨道数量和轨道间间隔，计算得到每条轨道的宽度信息
、
高度信息及位置信息；将数据集合中的数据与确定的轨道上的卫星单元进行对应，且每个数据对应一卫星单元；基于单个数据的大小，对数据集合中的数据进行排序，基于排序得到的最大数据和最小数据，以及初始设置的卫星单元的最大和最小宽度，确定单位大小数据对应的卫星单元宽度，从而对单个数据所对应卫星单元的宽度进行设置；将宽度设置完成的卫星单元投放至当前卫星单元所在的轨道
。4.
如权利要求1所述的一种前端的多重数据图表组件实现方法，其特征在于，当投放对应卫星单元至对应轨道之后，还包括：根据当前卫星单元所在轨道上卫星单...

【专利技术属性】
技术研发人员：肖华骏，
申请(专利权)人：中电云计算技术有限公司，
类型：发明
国别省市：