一种可视化图表构建方法、装置、系统及存储介质制造方法及图纸

技术编号:29331381 阅读:26 留言:0更新日期:2021-07-20 17:48
本发明专利技术实施例公开了一种可视化图表构建方法、装置、系统及存储介质,方法包括:构建图表模板库,并将图表模板库中的图表样式在屏幕中进行展示;读取屏幕的屏幕分辨率,根据屏幕分辨率对屏幕界面进行划分,生成与屏幕分辨率对应的用于排列图表的排列网格;获取用户选择的图表样式和填写的需要展示的数据内容集合,根据用户选择的图表样式和数据内容集合,生成预显示图表,预显示图表的长边边长和宽边边长都设定为排列网格的基本单位的整数倍;获取用户在排列网格中的点击位置,确定图表展示初始位置,将预显示图表在屏幕中进行排列显示。本方法有效的解决了各种浏览器及各种尺寸屏幕使用可视化前端配置工具的兼容问题。

【技术实现步骤摘要】
一种可视化图表构建方法、装置、系统及存储介质
本专利技术涉及计算机软件
,具体涉及一种可视化图表构建方法、装置、系统及存储介质。
技术介绍
在当前大数据时代的背景下,越来越多的数据需要在页面上展示;而如今一种很好的将数据直观、形象地“可视化”的手段展示就是通过图表的形式。数据可视化图表制作是一项十分重要的前端页面开发技术。在一个页面中,展示不同的数据往往需要有许多相同样式或不同形式的图表展示不同的数据,在具体实现时,往往需要配置一些各种各样大同小异的配置项;就会存在大量类似的代码,而不具备多年开发经验的开发人员就很容易让代码变得十分紊乱,使代码的可读性变差,后期维护也变得更难。在商业中,往往需要一些定制的数据图表,而对于一个非软件开发公司来说,开发属于自己定制的数据图表可能是一个极其困难且耗时的过程,而聘请专业开发人员或者软件开发公司通常费用很高,而且不一定能百分百按自己的想法来构建图表页面。
技术实现思路
针对现有技术中的技术缺陷,本专利技术实施例的目的在于提供一种可视化图表构建方法、装置、系统及存储本文档来自技高网...

【技术保护点】
1.一种可视化图表构建方法,其特征在于,包括:/n构建图表模板库,并将图表模板库中的图表样式在屏幕中进行展示;/n读取所述屏幕的屏幕分辨率,根据所述屏幕分辨率对屏幕界面进行划分,生成与所述屏幕分辨率对应的用于排列图表的排列网格;/n获取用户选择的图表样式和填写的需要展示的数据内容集合,根据所述用户选择的图表样式和数据内容集合,生成预显示图表,所述预显示图表的长边边长和宽边边长都设定为排列网格的基本单位的整数倍;/n获取用户在所述排列网格中的点击位置,确定图表展示初始位置,将所述预显示图表在所述屏幕中进行排列显示。/n

【技术特征摘要】
1.一种可视化图表构建方法,其特征在于,包括:
构建图表模板库,并将图表模板库中的图表样式在屏幕中进行展示;
读取所述屏幕的屏幕分辨率,根据所述屏幕分辨率对屏幕界面进行划分,生成与所述屏幕分辨率对应的用于排列图表的排列网格;
获取用户选择的图表样式和填写的需要展示的数据内容集合,根据所述用户选择的图表样式和数据内容集合,生成预显示图表,所述预显示图表的长边边长和宽边边长都设定为排列网格的基本单位的整数倍;
获取用户在所述排列网格中的点击位置,确定图表展示初始位置,将所述预显示图表在所述屏幕中进行排列显示。


2.根据权利要求1所述的一种可视化图表构建方法,其特征在于,其特征在于,所述读取所述屏幕的屏幕分辨率,根据所述屏幕分辨率对屏幕界面进行划分,生成与所述屏幕分辨率对应的用于排列图表的排列网格,具体包括:
根据所述屏幕分辨率,确定用于划分所述屏幕界面的基本单位a;
按照所述基本单位a对所述屏幕界面进行划分,将所述屏幕界面划分为由正方形组成的排列网格,其中,所述正方形边长为所述基本单位a。


3.根据权利要求1所述的一种可视化图表构建方法,其特征在于,其特征在于,所述根据所述用户选择的图表样式和数据内容集合,生成预显示图表,具体包括:
根据所述数据内容集合,确定所述数据内容集合包含的所述数据内容的数量;
根据所述数据内容的数量和所述排列网格的基本单位,对所述用户选择的图表样式进行整合,生成匹配图表;
将所述数据内容集合填写到所述匹配图表中,生成预显示图表。


4.根据权利要求1所述的一种可视化图表构建方法,其特征在于,其特征在于:所述预显示图表的左上角与用户点击的排列网格的左上角对齐。


5.一种可视化图表构建装置,其特征在于,包括:
模板库构建模块,用于构建图表模板库,并将图表模板库中的图表样式在屏幕中进行展示;
排列网格生成模块,用于读取所述屏幕的屏幕分辨率,根据所述屏幕分辨率对...

【专利技术属性】
技术研发人员:周凯文王堃王成
申请(专利权)人:青岛以萨数据技术有限公司
类型:发明
国别省市:山东;37

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

1