基于数据库技术的图表可视化编辑方法和系统与流程

文档序号:19610160发布日期:2020-01-03 14:02阅读:196来源:国知局
本申请涉及图表处理
技术领域
:,具体地说,涉及一种基于数据库技术的图表可视化编辑方法和系统。
背景技术
::在软件系统的开发过程中,图表作为可视化工具是系统中不可缺少的一部分,图表形式的展示可以将数据情况直观的传达给用户,通过对数据的整合分类使数据更易于理解,不同的图表样式以及颜色也使得系统页面更加友好丰富,对软件整体的效果提升有极大的帮助。当前图表工具非常丰富,软件中常用到的图表工具有echarts、fusioncharts、highcharts、datatables等;常用的工具除了提供多样的图表也可以进行前台数据的编辑工作;但是当前的图表编辑无法在数据库中持久化储存,导致下一次图表展示的时候数据还会返回原始的数据集,因此无法满足部分用户对图表可编辑的要求。技术实现要素:有鉴于此,本申请提供了一种基于数据库技术的图表可视化编辑方法和系统,能够将编辑、修改、保存后的数据渲染到前台可视化图表,并将数据转换为字符串存储到后台数据库;有利于对图表编辑框的数据进行持久化的存储。为了解决上述技术问题,本申请有如下技术方案:第一方面,一种基于数据库技术的图表可视化编辑方法,包括:后台程序通过分析整合获取图表数据;将所述图表数据渲染到前台可视化图表,并将所述图表数据转换为字符串格式;将所述字符串格式的图表数据存储到后台数据库的对应字段中,并对所述字符串格式的图表数据进行id标识;等待接收用户输入的对目标图表进行编辑的编辑指令:若未接收到所述编辑指令,则继续等待;若接收到所述编辑指令,则根据所述目标图表对应的id在所述后台数据库中读取该目标图表对应的图表数据,将所述目标图表对应的图表数据根据不同的字符串格式进行拆分和转换,使所述目标图表对应的图表数据转换为图表可使用的对应格式展示在图表编辑框中;等待接收用户输入的对所述图表编辑框中的数据进行修改的修改指令,若未接收到所述修改指令,则继续等待;若接收到所述修改指令,则根据所述修改指令对所述图表编辑框中的数据进行修改;等待接收用户输入的对所述图表编辑框中的数据进行保存的保存指令,若未接收到所述保存指令,则继续等待;若接收到所述保存指令,则将图表编辑框中的数据进行保存;将保存后的数据渲染到前台可视化图表中,并将编辑完成后的数据再次转换为字符串存储到后台数据库。可选地,其中:等待接收用户输入的对已存储到后台数据库的图表数据进行调取的调取指令;若未接收到所述调取指令,则继续等待;若接收到所述调取指令,则直接从后台数据库中调取所述图表数据,将所述图表数据渲染到前台可视化图表中展示。可选地,其中:所述图表数据包括图数据和表格数据,其中,所述图数据包括:柱状图、折线图、饼状图和散点图;所述表格数据包括:元素、标题、展示颜色和图表说明。可选地,其中:所述图数据以逗号和分号的形式存储到后台数据库中。可选地,其中:所述表格数据以数组的形式进行存储,所述表格数据中的单条对象以大括号进行存储,单条对象之间通过逗号进行分隔,单元格数据以键值对的形式进行存储。第二方面,一种基于数据库技术的图表可视化编辑系统,包括:分析整合模块、数据渲染模块、数据存储模块、数据转换模块和数据编辑模块;所述分析整合模块用于后台程序通过分析整合获取图表数据;所述数据渲染模块用于将所述图表数据渲染到前台可视化图表,并将所述图表数据转换为字符串格式;所述数据存储模块用于将所述字符串格式的图表数据存储到后台数据库的对应字段中,并对所述字符串格式的图表数据进行id标识;所述数据转换模块在接收到用户输入的对目标图表进行编辑的编辑指令时,根据所述目标图表对应的id在所述后台数据库中读取该目标图表对应的图表数据,将所述目标图表对应的图表数据根据不同的字符串格式进行拆分和转换,使所述目标图表对应的图表数据转换为图表可使用的对应格式展示在图表编辑框中;所述数据编辑模块用于在接收用户输入的对所述图表编辑框中的数据进行修改的修改指令时,根据所述修改指令对所述图表编辑框中的数据进行修改;所述数据存储模块还用于在接收用户输入的对所述图表编辑框中的数据进行保存的保存指令时,将图表编辑框中的数据进行保存;并将编辑完成后的数据再次转换为字符串存储到后台数据库;所述数据渲染模块还用于将保存后的数据渲染到前台可视化图表中。可选地,其中:所述基于数据库技术的图表可视化编辑系统还包括数据调取模块,所述数据调取模块用于当接收到用户输入的对已存储到后台数据库的图表数据进行调取的调取指令时,直接从后台数据库中调取所述图表数据,将所述图表数据渲染到前台可视化图表中展示。可选地,其中:所述图表数据包括图数据和表格数据,其中,所述图数据包括:柱状图、折线图、饼状图和散点图;所述表格数据包括:元素、标题、展示颜色和图表说明。可选地,其中:所述图数据以逗号和分号的形式存储到后台数据库中。可选地,其中:所述表格数据以数组的形式进行存储,所述表格数据中的单条对象以大括号进行存储,单条对象之间通过逗号进行分隔,单元格数据以键值对的形式进行存储。与现有技术相比,本申请所述的基于数据库技术的图表可视化编辑方法和系统,达到了如下效果:本申请提供的基于数据库技术的图表可视化编辑方法和系统,通过将后台程序分析整合获取的图表数据渲染到前台可视化图表,并将图表数据转换为字符串格式;将字符串格式的图表数据存储到后台数据库,并对此图表数据进行id标识;当接收到用户输入的对目标图表进行编辑的编辑指令时,根据目标图表的id在后台数据库中读取目标图表对应的图表数据,并对其进行拆分和转换,使目标图表对应的图表数据转换为图表可用格式展示于图表编辑框中;当接收到用户输入的对图表编辑框中数据进行修改的修改指令时,根据修改指令对图表编辑框中的数据进行修改;当接收到用户输入的对图表编辑框中的数据进行保存的保存指令时,将图表编辑框中的数据进行保存;保存后的数据进一步渲染到前台可视化图表中,并将所述数据再次转换为字符串存储到后台数据库中;如此,实现了在对图表进行数据编辑、修改的同时,也能够将更新后的数据进行保存,有利于对图表中编辑过后的数据进行持久化的储存,进而也能够保证图表数据在前台可视化图表中的持久展示,即便页面切换后仍旧可以展示切换前的数据,满足用户对于图形和表格数据的可视化编辑的要求。附图说明此处所说明的附图用来提供对本申请的进一步理解,构成本申请的一部分,本申请的示意性实施例及其说明用于解释本申请,并不构成对本申请的不当限定。在附图中:图1所示为本申请实施例所提供的基于数据库技术的图表可视化编辑方法流程图;图2所示为本申请实施例所提供的图表编辑框的示意图;图3所示为本申请实施例所提供的图数据示意图;图4所示为本申请实施例所提供的表格数据示意图;图5所示为本申请实施例所提供的基于数据库技术的图表可视化编辑方法的另一种流程图;图6所示为本申请实施例所提供的基于数据库技术的图表可视化编辑系统模块图。具体实施方式如在说明书及权利要求当中使用了某些词汇来指称特定组件。本领域技术人员应可理解,硬件制造商可能会用不同名词来称呼同一个组件。本说明书及权利要求并不以名称的差异来作为区分组件的方式,而是以组件在功能上的差异来作为区分的准则。如在通篇说明书及权利要求当中所提及的“包含”为一开放式用语,故应解释成“包含但不限定于”。“大致”是指在可接收的误差范围内,本领域技术人员能够在一定误差范围内解决所述技术问题,基本达到所述技术效果。说明书后续描述为实施本申请的较佳实施方式,然所述描述乃以说明本申请的一般原则为目的,并非用以限定本申请的范围。本申请的保护范围当视所附权利要求所界定者为准。当前图表工具非常丰富,软件中常用到的图表工具有echarts、fusioncharts、highcharts、datatables等;常用的工具除了提供多样的图表也可以进行前台数据的编辑工作;但是当前的图表编辑无法在数据库中持久化储存,导致下一次图表展示的时候数据还会返回原始的数据集,因此无法满足部分用户对图表可编辑的要求。有鉴于此,本申请提供了一种基于数据库技术的图表可视化编辑方法和系统,能够将编辑、修改、保存后的数据渲染到前台可视化图表,并将数据转换为字符串存储到后台数据库;有利于对图表编辑框的数据进行持久化的存储。以下结合附图和具体实施例进行详细说明。图1所示为本申请实施例所提供的基于数据库技术的图表可视化编辑方法流程图,请参照图1,本申请提供了一种基于数据库技术的图表可视化编辑方法,包括:步骤101、后台程序通过分析整合获取图表数据;步骤102、将图表数据渲染到前台可视化图表,并将图表数据转换为字符串格式;步骤103、将字符串格式的图表数据存储到后台数据库的对应字段中,并对字符串格式的图表数据进行id标识;步骤104、等待接收用户输入的对目标图表进行编辑的编辑指令:若未接收到编辑指令,则继续等待;若接收到编辑指令,则根据目标图表对应的id在后台数据库中读取该目标图表对应的图表数据,将目标图表对应的图表数据根据不同的字符串格式进行拆分和转换,使目标图表对应的图表数据转换为图表可使用的对应格式展示在图表编辑框中;步骤105、等待接收用户输入的对图表编辑框中的数据进行修改的修改指令,若未接收到修改指令,则继续等待;若接收到修改指令,则根据修改指令对图表编辑框中的数据进行修改;步骤106、等待接收用户输入的对图表编辑框中的数据进行保存的保存指令,若未接收到保存指令,则继续等待;若接收到保存指令,则将图表编辑框中的数据进行保存;步骤107、将保存后的数据渲染到前台可视化图表中,并将编辑完成后的数据再次转换为字符串存储到后台数据库。具体地,请继续参照如1,为了满足用户对于图表编辑时,能够将图表编辑后的数据在数据库中持久化存储的要求,本申请提供了一种基于数据库技术的图表可视化编辑方法,步骤101使后台程序通过分析整合获取图表数据,进而通过步骤102将步骤101获取到的图表数据渲染到前台可视化图表中进行展示,同时步骤102还将步骤101获取到的图表数据转换为字符串格式的数据;步骤103为将步骤102中转换为字符串格式的图表数据存储到后台数据库的对应字段中,并对所存储的图表数据进行id标识;此处的数据库可选为oracle数据库,字段类型为clob。步骤104为,当用户点击图表中对应的编辑按钮,即用户输入了对目标图表进行编辑的编辑指令后,根据目标图表对应的标识id在后台数据库中查找、并读取该目标图表对应的图表数据,将读取到的图表数据转换为前台可视化图表能够使用的格式展示到图表编辑框中,进而等待用户对于此数据的查看和进一步修改等操作;步骤105为用户根据自身需求对图表编辑框中的数据进行修改和调整,通过步骤106点击图表编辑框对应的保存/确认按钮,对步骤105中修改后的图表编辑框中的数据进行保存,若用户不想保存修改后的数据则点击取消按钮即可返回到步骤104中所读取的图表数据,图表编辑框请参照图2所示;步骤107为将步骤106中保存的数据渲染到前台可视化图表中进行展示,同时将编辑、修改、保存后的数据再次转换为字符串存储到后台数据库中。本申请提供了能够将编辑、修改、保存后的数据进行存储的方法,有利于对图表中编辑过后的数据进行持久化的储存,进而也能够保证图表数据在前台可视化图表中的持久展示,即便页面切换后仍旧可以展示切换前的数据,满足用户对于图形和表格数据的可视化编辑的要求。可选地,本申请还提供了一种可以查看存储到后台数据库中的修改过的图表数据的方法,具体为:等待接收用户输入的对已存储到后台数据库的图表数据进行调取的调取指令;若未接收到调取指令,则继续等待;若接收到调取指令,则直接从后台数据库中调取图表数据,将图表数据渲染到前台可视化图表中展示。可选地,请参照图3和图4,图3所示为本申请实施例所提供的图数据示意图;图4所示为本申请实施例所提供的表格数据示意图,图表数据包括图数据和表格数据,其中,图数据包括:柱状图、折线图、饼状图和散点图等,例如图3所展示的就是一种折线图;表格数据包括:元素、标题、展示颜色和图表说明等,例如图4所展示的表格中含有标题和元素等信息。可选地,图数据以逗号和分号的形式存储到后台数据库中;格式例如:“1季度,2季度,3季度,4季度;200,100,300,400”;上述格式中的内容,相当于图数据对象1为:1季度,2季度,3季度,4季度;图数据对象2为200,100,300,400;其中对象1和对象2的数据相互对应;例如对象1的第一个子对象“1季度”对应对象2的第一个子对象“200”,对象1的第二个子对象“2季度”对应对象2的第二个子对象“100”;上述数据应用到实际案例中时,例如可以代表业务数据1季度企业税收200万元,2季度企业税收100万元,3季度企业税收300万元,4季度企业税收400万元;以上述数据来绘制对应的图数据,例如柱状图、折线图等。可选地,表格数据以数组的形式进行存储,表格数据中的单条对象以大括号进行存储,单条对象之间通过逗号进行分隔,单元格数据以键值对的形式进行存储;格式例如:“[{‘name’:’zhangsan’,’age’:’18’},{‘name’:’lisi’,’age’:’19’}]”表中的单条记录存放在{}中,多条数据构成的表格数据存放在[]中,但最终存放在数据库中都是字符串的形式(非数组形式),{}和[]用于获取表格字符串后在前台用来拆分字符,在存储时不存在数组之类的概念。图5所示为本申请实施例所提供的基于数据库技术的图表可视化编辑方法的另一种流程图,请参照图5,步骤201为后台程序通过分析整合获取图表数据,进而步骤202和步骤203同时进行,步骤202为将步骤201中获取的图表数据渲染到前台可视化图表中进行展示,步骤203为将步骤201获取的图表数据转换为字符串格式,并通过步骤204存储到数据库中;当点击前台可视化图表中的编辑按钮时,通过步骤205将数据库中的数据获取到编辑框中,通过步骤206对编辑框中的数据进行编辑,编辑完成后点击页面上的保存/确认按钮,步骤207为对编辑框中的数据进行编辑、保存完成的步骤,进而将保存后的数据转换为字符串存储到数据库中,并将保存后的数据渲染到前台可视化图表中进行展示。基于同一发明构思,本申请还提供了一种基于数据库技术的图表可视化编辑系统,图6所示为本申请实施例所提供的基于数据库技术的图表可视化编辑系统模块图,请参照图6,系统100包括:分析整合模块10、数据渲染模块20、数据存储模块30、数据转换模块40和数据编辑模块50;分析整合模块10用于后台程序通过分析整合获取图表数据;数据渲染模块20用于将图表数据渲染到前台可视化图表,并将图表数据转换为字符串格式;此处的图表数据包括图数据和表格数据,图数据包括:柱状图、折线图、饼状图和散点图等,表格数据包括:元素、标题、展示颜色和图表说明等;图数据以逗号和分号的形式存储到后台数据库中;格式例如:“1季度,2季度,3季度,4季度;200,100,300,400”;上述格式中的内容,相当于图数据对象1为:1季度,2季度,3季度,4季度;图数据对象2为200,100,300,400;其中对象1和对象2的数据相互对应;例如对象1的第一个子对象“1季度”对应对象2的第一个子对象“200”,对象1的第二个子对象“2季度”对应对象2的第二个子对象“100”;上述数据应用到实际案例中时,例如可以代表业务数据1季度企业税收200万元,2季度企业税收100万元,3季度企业税收300万元,4季度企业税收400万元;以上述数据来绘制对应的图数据,例如柱状图、折线图等。表格数据以数组的形式进行存储,表格数据中的单条对象以大括号进行存储,单条对象之间通过逗号进行分隔,单元格数据以键值对的形式进行存储;格式例如:“[{‘name’:’zhangsan’,’age’:’18’},{‘name’:’lisi’,’age’:’19’}]”;表中的单条记录存放在{}中,多条数据构成的表格数据存放在[]中,但最终存放在数据库中都是字符串的形式(非数组形式),{}和[]用于获取表格字符串后在前台用来拆分字符,在存储时不存在数组之类的概念。数据存储模块30用于将字符串格式的图表数据存储到后台数据库的对应字段中,并对字符串格式的图表数据进行id标识;此处的数据库可选为oracle数据库,字段类型为clob;数据转换模块40在接收到用户输入的对目标图表进行编辑的编辑指令时,根据目标图表对应的id在后台数据库中读取该目标图表对应的图表数据,将目标图表对应的图表数据根据不同的字符串格式进行拆分和转换,使目标图表对应的图表数据转换为图表可使用的对应格式展示在图表编辑框中;数据编辑模块50用于在接收用户输入的对图表编辑框中的数据进行修改的修改指令时,根据修改指令对图表编辑框中的数据进行修改;数据存储模块30还用于在接收用户输入的对图表编辑框中的数据进行保存的保存指令时,将图表编辑框中的数据进行保存;并将编辑完成后的数据再次转换为字符串存储到后台数据库;数据渲染模块20还用于将保存后的数据渲染到前台可视化图表中。可选地,本申请基于数据库技术的图表可视化编辑系统100除了上述模块外,还包括数据调取模块,数据调取模块用于当接收到用户输入的对已存储到后台数据库的图表数据进行调取的调取指令时,直接从后台数据库中调取图表数据,将图表数据渲染到前台可视化图表中展示。有利于对图表中编辑过后的数据进行持久化的储存,满足用户对于图形和表格数据的可视化编辑的要求。通过以上各实施例可知,本申请存在的有益效果是:本申请提供的基于数据库技术的图表可视化编辑方法和系统,通过将后台程序分析整合获取的图表数据渲染到前台可视化图表,并将图表数据转换为字符串格式;将字符串格式的图表数据存储到后台数据库,并对此图表数据进行id标识;当接收到用户输入的对目标图表进行编辑的编辑指令时,根据目标图表的id在后台数据库中读取目标图表对应的图表数据,并对其进行拆分和转换,使目标图表对应的图表数据转换为图表可用格式展示于图表编辑框中;当接收到用户输入的对图表编辑框中数据进行修改的修改指令时,根据修改指令对图表编辑框中的数据进行修改;当接收到用户输入的对图表编辑框中的数据进行保存的保存指令时,将图表编辑框中的数据进行保存;保存后的数据进一步渲染到前台可视化图表中,并将所述数据再次转换为字符串存储到后台数据库中;如此,实现了在对图表进行数据编辑、修改的同时,也能够将更新后的数据进行保存,有利于对图表中编辑过后的数据进行持久化的储存,进而也能够保证图表数据在前台可视化图表中的持久展示,即便页面切换后仍旧可以展示切换前的数据,满足用户对于图形和表格数据的可视化编辑的要求。本领域内的技术人员应明白,本申请的实施例可提供为方法、装置、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、cd-rom、光学存储器等)上实施的计算机程序产品的形式。上述说明示出并描述了本申请的若干优选实施例,但如前所述,应当理解本申请并非局限于本文所披露的形式,不应看作是对其他实施例的排除,而可用于各种其他组合、修改和环境,并能够在本文所述发明构想范围内,通过上述教导或相关领域的技术或知识进行改动。而本领域人员所进行的改动和变化不脱离本申请的精神和范围,则都应在本申请所附权利要求的保护范围内。当前第1页1 2 3 当前第1页1 2 3 
当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1