CN108255969A - 可视化图表页面实现方法、装置、终端设备及存储介质 - Google Patents

Abstract

本发明公开了一种可视化图表页面实现方法、装置、终端设备及存储介质。该实现方法中，先获取图表编辑请求，图表编辑请求包括用户ID和数据来源ID。基于图表编辑请求中的用户ID，获取用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示基础图表列表。然后获取图表选择请求，图表选择请求包括图表类型ID和可视化区域ID，通过从基础图表列表中获取与图表类型ID相对应的目标图表，将目标图表放置在可视化图表配置界面中与可视化区域ID相对应的配置区域上。基于数据来源ID获取原始数据，采用目标图表对原始数据进行处理，获取可视化图表页面。该实现方法能够帮助用户快速实现可视化图表页面，降低实现成本，提高实现效率。

Description

可视化图表页面实现方法、装置、终端设备及存储介质

技术领域

本发明涉及数据处理领域，尤其涉及一种可视化图表页面实现方法、装置、终端设备及存储介质。

背景技术

随着网络技术和数据库技术的成熟以及数据应用的普及，数据量正在以指数级速度增长。面对日益庞大的数据，人们已不满足于仅仅对数据进行管理，更希望能对数据进行分析，进而进行可视化处理，以更直观地体现数据中的信息。而在数据可视化处理过程中，非技术人员很难把手中的数据，直接渲染成可视化图表页面，这个过程往往需要技术人员通过复杂的开发制作流程来实现，而且这个实现过程会花费大量的资金和时间成本。而传统的图表制作工具制作可视化图表页面的流程比较复杂，不易掌握，也需要花费大量的时间进行学习，可视化图表页面制作的效率普遍不高。

发明内容

本发明实施例提供一种可视化图表页面实现方法、装置、终端设备及存储介质，以解决用户无法高效、便捷地实现可视化图表页面的问题。

第一方面，本发明实施例提供一种可视化图表页面实现方法，包括：

获取图表编辑请求，所述图表编辑请求包括用户ID和数据来源ID；

基于所述用户ID，获取所述用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示所述基础图表列表；

获取图表选择请求，所述图表选择请求包括图表类型ID和可视化区域ID；

从所述基础图表列表中获取与所述图表类型ID相对应的目标图表，将所述目标图表放置在所述可视化图表配置界面中与所述可视化区域ID相对应的配置区域；

基于所述数据来源ID获取原始数据，采用所述目标图表对所述原始数据进行处理，获取可视化图表页面。

第二方面，本发明实施例提供一种可视化图表页面实现装置，包括：

图表编辑请求获取模块，用于获取图表编辑请求，所述图表编辑请求包括用户ID和数据来源ID；

基础图表列表获取模块，用于基于所述用户ID，获取所述用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示所述基础图表列表；

图表选择请求获取模块，用于获取图表选择请求，所述图表选择请求包括图表类型ID和可视化区域ID；

目标图表获取模块，用于从所述基础图表列表中获取与所述图表类型ID相对应的目标图表，将所述目标图表放置在所述可视化图表配置界面中与所述可视化区域ID相对应的配置区域；

可视化图表页面获取模块，用于基于所述数据来源ID获取原始数据，采用所述目标图表对所述原始数据进行处理，获取可视化图表页面。

第三方面，本发明实施例提供一种终端设备，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现所述可视化图表页面实现方法的步骤。

第四方面，本发明实施例提供一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时实现所述图表可视化页面实现方法的步骤。

本发明实施例提供的可视化图表页面实现方法、装置、终端设备及存储介质中，先获取图表编辑请求，图表编辑请求包括用户ID和数据来源ID。基于图表编辑请求中用户ID，获取用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示基础图表列表，可直观地将基础图表列表呈现给用户，以方便用户进行选择。然后获取图表选择请求，图表选择请求包括图表类型ID和可视化区域ID，通过从基础图表列表中获取与图表类型ID相对应的目标图表，将目标图表放置在可视化图表配置界面中与可视化区域ID相对应的配置区域上，以实现在可视化图表配置界面上配置至少一种图表类型ID对应的目标图表。基于数据来源ID获取原始数据，采用目标图表对原始数据进行处理，即使得可视化图表配置界面中每一配置区域采用一目标图表对原始数据进行处理，基于所有配置区域形成的图表形成可视化图表页面。本发明实施例可帮助用户快速高效地制作可视化图表页面，提高可视化图表页面的制作效率，降低可视化图表页面的实现成本。

附图说明

为了更清楚地说明本发明实施例的技术方案，下面将对本发明实施例的描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1是本发明实施例1中可视化图表页面实现方法的一流程图；

图2是图1中步骤S20的一具体实施方式的一流程图。

图3是图1中步骤S50的一具体实施方式的一流程图。

图4是本发明实施例1中可视化图表页面实现方法的一具体实施方式的一流程图。

图5是本发明实施例1中可视化图表页面实现方法的另一具体实施方式的一流程图。

图6是本发明实施例2中可视化图表页面实现装置的一原理框图。

图7是本发明实施例4中终端设备的一示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

实施例1

图1示出本实施例中可视化图表页面实现方法的流程图。该可视化图表页面实现方法应用在电脑、平板或其他终端设备上，用于高效、便捷地制作可视化图表页面。如图1所示，该可视化图表页面实现方法包括如下步骤：

S10：获取图表编辑请求，图表编辑请求包括用户ID和数据来源ID。

其中，图表编辑请求是指对图表的内容或者形式进行编辑的请求。用户ID是用于区别不同用户的标识，一个用户ID对应一唯一用户。数据来源ID是用于标识原始数据的标识，通过数据来源ID可以快速定位到对应的原始数据，以便基于数据来源ID获取对应的原始数据。原始数据是需要进行图表化处理的数据源，原始数据呈现形式有多种，包括但不限于Excel文档和链接数据库等形式中的至少一种。在一个实施方式中，可以根据原始数据的特点获取原始数据需要呈现的图表的类型、维度和指标等相关信息。例如，如果通过三维形状可以更好地体现原始数据的特点，则其选择的图表类型就可以为三维图表类型，使原始数据以三维图表的形式进行呈现。

S20：基于用户ID，获取用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示基础图表列表。

其中，图表可分为不同的类型，如条形图、柱状图、折线图、三维图和饼状图等类型。基础图表列表是指不包含数据内容的基础图表对应的列表。可视化图表配置界面是指利用计算机图形学和图像处理技术，将数据转换成图形或图像在屏幕上显示出来的配置界面。用户ID是用户的唯一标识，通过用户ID可以确定该用户权限范围内的所有基础图表，将所有基础图表以列表的形式在可视化图表配置界面中显示，即在可视化图表配置界面中显示基础图表列表。如此，可直观地将基础图表列表呈现给用户，方便用户进行合理地选择。

S30：获取图表选择请求，图表选择请求包括图表类型ID和可视化区域ID。

其中，图表选择请求是指对在用户ID对应的权限范围内的基础图表进行选择，并使该基础图表在可视化图表配置界面的对应配置区域上显示的请求。图表类型ID是用来识别不同类型图表的标识，每一种类型的图表都具有唯一对应的图表类型ID，基于图表类型ID可以快速查找到对应类型的图表。可视化图表配置界面上划分为不同的配置区域，可视化区域ID是用于识别可视化图表配置界面上不同配置区域的标识，一个配置区域对应一唯一的可视化区域ID，以便于通过可视化区域ID快速定位到可视化图表配置界面上对应的配置区域。

S40：从基础图表列表中获取与图表类型ID相对应的目标图表，将目标图表放置在可视化图表配置界面中与可视化区域ID相对应的配置区域。

基于图表类型ID，可以确定用户选择了何种类型的图表，以从基础图表列表中获取与图表类型ID相对应的目标图表。例如，如果图表类型ID对应的是饼状图，则从基础图标列表中获取到饼状图，该饼状图就是图表类型ID对应的目标图表。获取到目标图表之后，根据可视化区域ID，定位到可视化图表配置界面中与可视化区域ID相对应的配置区域，并将该目标图表放置在该配置区域上，以确定可视化图表配置界面中每一配置区域对应的目标图表。

在一个具体实施方式中，将目标图表放置在可视化图表配置界面中与可视化区域ID相对应的配置区域，具体包括：在可视化图表配置界面上，采用JQuery UI–draggable插件将目标图表拖拽到可视化图表配置界面中与可视化区域ID相对应的配置区域上。

其中，JQuery UI–Draggable插件是用来使选中的元素或者对象通过鼠标进行拖动的插件。在可视化图表配置界面上，用户通过鼠标选中目标图表，采用JQuery UI–draggable插件将目标图表拖拽到与可视化区域ID相对应的配置区域上，以实现快速高效地确定可视化图表配置界面中每一配置区域对应的目标图表。当JQuery UI–draggable插件检测到用户在可视化图表配置界面上松开鼠标时，则将当前拖动的目标图表放置在与可视化区域ID相对应的配置区域上，即采用JQuery UI–draggable插件将目标图表配置在对应的配置区域时，只需控制鼠标从基础图表列表中选择目标图表并拖拽到配置区域即可，操作过程简单方便，有利于提高可视化图表页面的制作效率。

S50：基于数据来源ID获取原始数据，采用目标图表对原始数据进行处理，获取可视化图表页面。

具体地，可根据接收到的图表编辑请求中的数据来源ID确定要在目标图表中体现的部分或全部原始数据，并采用可视化图表配置界面的每一配置区域上的目标图表对该部分或全部原始数据进行可视化处理，以分别获取对应的可视化图表，以使可视化图表配置界面的相应配置区域中显示对应的可视化图表，以形成可视化图表页面。

例如，在选择需要在目标图表中体现的部分或全部原始数据之后，通过设定目标图表的相关图表参数，以将该部分或全部原始数据通过可视化的方式体现出来，以形成相应的可视化图表。其中，图表参数是用于配置图表的参数，该参数包括但不限于大小、色彩、类型和显示位置等信息中的至少一个。例如，当目标图表为饼状图时，在设定饼状图的颜色、大小和显示位置等图表参数之后，采用设置好图表参数的目标图表对选定的部分或全部原始数据进行可视化处理，得到对应的目标饼状图(即为可视化图表)。

本发明实施例提供的可视化图表页面实现方法中，先获取图表编辑请求，图表编辑请求包括用户ID和数据来源ID。基于图表编辑请求中用户ID，获取用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示基础图表列表，可直观地将基础图表列表呈现给用户，以方便用户进行选择。然后获取图表选择请求，图表选择请求包括图表类型ID和可视化区域ID，通过从基础图表列表中获取与图表类型ID相对应的目标图表，将目标图表放置在可视化图表配置界面中与可视化区域ID相对应的配置区域上，以实现在可视化图表配置界面上配置至少一种图表类型ID对应的目标图表。基于数据来源ID获取原始数据，采用目标图表对原始数据进行处理，即使得可视化图表配置界面中每一配置区域采用一目标图表对原始数据进行处理，基于所有配置区域形成的图表形成可视化图表页面。通过该可视化图表页面实现方法，可帮助用户快速高效地制作可视化图表页面，提高可视化图表页面的制作效率，降低可视化图表页面的实现成本。

在一个具体实施方式中，如图2所示，在可视化图表配置界面中显示基础图表列表，包括：

S21：创建至少一个文档对象模型，文档对象模型用于存储基础图表列表中每一基础图表的图表参数。

其中，文档对象模型(Document Object Model，简称DOM)是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上，页面或文档的对象被组织在一个树形结构中(即DOM中)，用来表示页面或者文档中对象的标准模型。DOM技术使得用户页面可以动态地变化，如可以动态地显示或隐藏一个元素，改变元素的属性，增加一个元素等，增强了页面的交互性。在本实施例中，文档对象模型用于存储每一基础图表的图表参数，即为DOM添加对象的属性，每一基础图表的图表参数在DOM对象中。

S22：基于至少一个文档对象模型的图表参数，在可视化图表配置界面上渲染出每一基础图表对应的缩略图。

将步骤S21中创建的至少一个文档对象模型添加到浏览器中，并基于至少一个文档对象模型的图表参数，在可视化图表配置界面的配置区域上渲染出用户能够查看的基础图表对应的缩略图，从而实现在可视化图表配置界面中显示基础图表列表，以便于进行图表选择。

本实施方式中，通过创建文档对象模型，存储基础图表的图表参数，以使基础图表的图表参数在DOM对象中，为DOM对象依据图表参数添加属性。基于至少一个文档对象模型，在可视化图表配置界面上渲染出与基础图表对应的缩略图，以通过缩略图在可视化图表配置界面上显示至少一个图表类型。通过缩略图可以更加直观地体现不同基础图表的区别，以有助于更直观、快捷地选择合适的基础图表进行可视化处理，提高可视化图表页面制作效率。

在一个具体实施方式中，在采用目标图表对原始数据进行处理时，可对选定的目标图表进行调整，以更换新的目标图表，再对原始数据进行处理，以使可视化图表页面可根据用户需求自主设置。如图3所示，该可视化图表页面实现方法还包括：

S51：获取图表调整请求，图表调整请求包括调整区域ID和调整类型ID。

其中，图表调整请求是指对当前已经选择的目标图表进行调整的请求。在选择目标图表之后，若发现该图表类型对应的目标图表不合适，就可以通过图表调整请求对当前的目标图表进行调整，更换成新的图表类型对应的目标图表。调整区域ID是用于识别调整前的目标图表(即所要调整的目标图表)在可视化图表配置界面上所处的配置区域的标识。调整类型ID用于识别调整后新的图表类型的标识，即用于确定需要将当前配置区域上的目标图表调整成何种新的图表类型的目标图表。

S52：基于调整区域ID，确定与调整区域ID相对应的配置区域中的目标图表。

通过调整区域ID，定位到可视化图表配置界面中对应的配置区域，进而确定此时处于该配置区域的目标图表，该目标图表就是需要进行调整的图表。

S53：基于调整类型ID，在基础图表列表中获取与调整类型ID相对应的调整图表。

基于调整类型ID，可以确定用户选择了何种图表类型的新图表，以从基础图表列表中获取与调整类型ID相对应的调整图表。该调整图表是用户通过图表调整请求重新确定的需在可视化图表配置界面中相应的配置区域显示的新的目标图表。

S54：采用转场方法将目标图表替换成调整图表，以使调整图表成为新的目标图表。

其中，转场方法是指实现段落与段落、场景与场景之间的过渡或转换的方法。在一个实施方式中，转场方法可以包括淡入淡出、翻转、滑动或翻页等。可选地，可以设置一种转场方法为默认转场方法，如设置翻转为默认的转场方法。即在该步骤中，默认都采用翻转的转场方法实现将可视化图表配置界面的配置区域中当前显示的目标图表调整为调整类型ID对应的调整图表(即更新为新的目标图表)，并基于该调整图表对原始数据进行处理，以获取对应的可视化图表，从而实现可视化图表页面。

例如，当前目标图表为饼状图，用户在图表可视化过程中发现柱状图更能够体现原始数据的特点，可通过客户端生成图表调整请求，把目标图表从饼状图调整为柱状图。此时，图表调整请求中包括调整区域ID和调整类型ID，调整区域ID对应饼状图在可视化图表配置界面上的配置区域，调整类型ID对应基础图标中的柱状图。基于调整区域ID和调整类型ID，将此时可视化图表配置界面上对应配置区域里的饼状图采用转场方法调整为柱状图。

本实施例中，通过图表调整请求，可以调整在可视化图表配置界面中相应配置区域的图表类型。当用户在选择了目标图表的初始类型之后，发现目标图表的类型不合适时，可以根据本实施例中的图表调整请求来实现对可视化图表配置界面中相应配置区域中显示的图表进行调整，该调整方式操作简单、便捷，可以实现更加方便、快捷地更新可视化图表的技术效果。

在一个具体的实施方式中，可视化图表页面包括浏览路径，浏览路径是指对可视化图表页面的访问路径。在可视化图表配置界面上生成与可视化图表页面相对应的浏览路径，以便基于该浏览路径查阅相应的可视化图表页面。如图4所示,在基于数据来源ID获取原始数据，采用目标图表对原始数据进行处理，获取可视化图表页面之后，该可视化图表页面实现方法还包括：

S61：获取权限配置请求，权限配置请求包括浏览路径和页面类型。

其中，权限配置请求是指用户对自助实现的可视化图表页面的访问权限进行配置的请求。页面类型是指可视化图表页面所属的类型，页面类型包括但不限于隐私页面类型、安全页面类型和常规页面类型中的至少一种。若页面涉及隐秘信息(如闺蜜照、亲子照和日记等)，则为隐私页面类型；页面涉及个人账户等信息(如支付宝账号和银行卡账号等)，则为安全页面类型；页面涉及的信息为公开信息(如新闻和风景等)，则为常规页面类型。

S62：基于页面类型和预设的页面权限配置表，确定与页面类型相对应的用户类权限。

其中，页面权限配置表是指针对不同页面类型的访问权限进行配置的表格。用户类权限是指能够对某一页面类型的页面进行访问的一类人所具有的访问权限。页面权限配置表中每一页面类型可对应配置至少一个用户类权限，使得具有这些用户类权限的用户可访问相应的页面类型。由于不同页面类型对应的用户类权限不同，所以可以基于页面类型和预设的页面权限配置表，确定可访问该页面类型对应的页面的用户所属的用户类权限。

例如，将用户按权限类别分为一级用户、二级用户和三级用户。不同等级用户能够访问的页面的类型是不同的。一级用户仅可以访问常规页面类型的可视化图表页面，二级用户可以访问安全页面类型和常规页面类型的可视化图表页面，而三级用户拥有最高权限，可以访问隐私页面类型、安全页面类型和常规页面类型这三种类型的可视化图表页面。此时，隐私页面类型的可视化图表页面对应的用户类权限就是三级用户。

S63：将浏览路径和用户类权限进行关联，完成浏览路径对应的可视化图表页面的访问权限配置。

在步骤S62中确定与页面类型相对应的用户类权限后，将浏览路径和该用户类权限进行关联，完成浏览路径对应的可视化图表页面的访问权限配置，以确定只有具备该用户类权限的用户才可以通过该浏览路径查看相应的可视化图表页面。

本实施例中，得到可视化图表页面之后，对该可视化图表页面的访问权限进行配置，可以更系统地对可视化图表页面进行管理，并提高可视化图表页面访问的安全性。

在一具体实施方式中，如图5所示，在将浏览路径和用户类权限进行关联，完成浏览路径对应的可视化图表页面的访问权限配置之后，该可视化图表页面实现方法还包括如下步骤：

S71：获取页面访问请求，页面访问请求包括用户ID和目标访问路径。

其中，页面访问请求是指用于访问目标页面的请求。用户ID用来识别不同用户的标识，每一用户具有一唯一用户ID，基于用户ID可以快速查找到对应的用户，以确定其访问权限。目标访问路径是指用户要访问的可视化图表页面对应的浏览路径，如浏览URL。

S72：基于用户ID和预设的用户权限配置表，获取与用户ID相对应的目标用户类权限。

用户权限配置表记录了不同用户ID对应的用户类权限，每一用户ID对应一用户类权限。通过用户ID查询预先存储在数据库中的用户权限配置表，可以快速定位并获取到与用户ID相对应的目标用户类权限。其中，目标用户类权限是指通过查询用户权限配置表确定的与用户ID相对应的用户类权限。通过用户权限配置表可以快速获取到用户ID对应的目标用户类权限，而且该目标用户类权限的获取过程操作简单方便。

S73：基于目标访问路径，获取对应的目标页面类型。

目标页面类型是指目标访问路径所对应的页面类型。基于目标访问路径，获取该目标访问路径对应的目标页面类型，以确定当前用户的目标访问路径对应的可视化图表页面的页面类型。

S74：基于页面权限配置表，判断目标页面类型是否与目标用户类权限对应。

通过用户权限配置表获取到用户ID对应的目标用户类权限，再基于目标访问路径获取对应的可视化图表页面的页面类型后，在页面权限配置表中进行查询，针对目标页面类型是否与目标用户类权限对应进行判断。

S75：若目标页面类型与目标用户类权限对应，则响应页面访问请求。

具体地，在依据步骤S74的判断结果对用户输入的页面访问请求进行处理时，若目标页面类型与目标用户类权限对应，则用户有权限查看目标页面类型的页面，此时响应用户输入的页面访问请求，允许用户访问页面。可以理解地，若目标页面类型与目标用户类权限对应是指通过目标页面类型与目标用户类权限确定当前用户具有访问该目标页面类型的权限。

例如，若目标页面类型为常规页面类型，而目标用户类权限是拥有访问安全页面类型和常规页面类型页面的权限，则此时目标页面类型与目标用户类权限就是对应的，即该用户是有访问该目标访问路径对应的页面的权限。因此，目标页面类型与目标用户类权限对应，可响应页面访问请求，允许用户访问页面。只有当目标页面类型与目标用户类权限对应时，才响应页面访问请求，确保访问目标访问路径对应的页面的安全性。

S76：若目标页面类型不与目标用户类权限对应，则拒绝页面访问请求。

具体地，在依据步骤S74的判断结果对用户输入的页面访问请求进行处理时，若目标页面类型与目标用户类权限不对应，则用户没有权限查看目标访问路径对应的页面，此时拒绝用户输入的页面访问请求，拒绝用户访问页面。具体地，目标页面类型不与目标用户类权限对应是指通过目标页面类型与目标用户类权限确定当前用户不具有访问该目标访问路径对应的页面的权限。

例如，若目标页面类型为隐私页面类型，而目标用户类权限是允许访问安全页面类型和常规页面类型的页面，则此时目标页面类型与目标用户类权限就是不对应的，即该用户不具有访问目标页面权限的权限。因此，拒绝页面访问请求，不允许用户访问目标访问路径对应的页面。只有当目标页面类型与目标用户类权限对应时，才响应用户的页面访问请求，确保目标页面的安全性。

在本实施例中，当接收到页面访问请求时，基于预设的页面权限配置表，判断目标页面类型是否与目标用户类权限对应，以基于判断结果对页面访问请求进行处理，以提高可视化图表页面访问的安全性。

应理解，上述实施例中各步骤的序号的大小并不意味着执行顺序的先后，各过程的执行顺序应以其功能和内在逻辑确定，而不应对本发明实施例的实施过程构成任何限定。

实施例2

图6示出与实施例1中可视化图表页面实现方法一一对应的图表页面实现装置的原理框图。如图6所示，该图表页面实现装置包括图表编辑请求获取模块10、基础图表列表获取模块20、图表选择请求获取模块30、目标图表获取模块40、可视化图表页面获取模块50、权限配置模块60和安全访问模块70。其中，图表编辑请求获取模块10、基础图表列表获取模块20、图表选择请求获取模块30、目标图表获取模块40、可视化图表页面获取模块50、权限配置模块60和安全访问模块70的实现功能与实施例1中可视化图表页面实现方法对应的步骤一一对应，为避免赘述，本实施例不一一详述。

图表编辑请求获取模块10，用于获取图表编辑请求，图表编辑请求包括用户ID和数据来源ID。

基础图表列表获取模块20，用于基于用户ID，获取用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示基础图表列表。

图表选择请求获取模块30，用于获取图表选择请求，图表选择请求包括图表类型ID和可视化区域ID。

目标图表获取模块40，用于从基础图表列表中获取与图表类型ID相对应的目标图表，将目标图表放置在可视化图表配置界面中与可视化区域ID相对应的配置区域。

可视化图表页面获取模块50，用于基于数据来源ID获取原始数据，采用目标图表对原始数据进行处理，获取可视化图表页面。

优选地，基础图表列表获取模块20包括文档对象模型创建单元21和缩略图渲染单元22。

文档对象模型创建单元21，用于创建至少一个文档对象模型，文档对象模型用于存储基础图表列表中每一基础图表的图表参数。

缩略图渲染单元22，用于基于至少一个文档对象模型的图表参数，在可视化图表配置界面上渲染出每一基础图表对应的缩略图。

优选地，目标图表获取模块40，用于在可视化图表配置界面上，采用JQuery UI–draggable插件将目标图表拖拽到与可视化区域ID相对应的区域位置上。

优选地，可视化图表页面获取模块50还包括图表调整请求获取单元51、目标图表确定单元52、调整图表获取单元53和目标图表调整单元54。

图表调整请求获取单元51，用于获取图表调整请求，图表调整请求包括调整区域ID和调整类型ID。

目标图表确定单元52，用于基于调整区域ID，确定与调整区域ID相对应的配置区域中的目标图表。

调整图表获取单元53，用于基于调整类型ID，在基础图表列表中获取与调整类型ID相对应的调整图表。

目标图表调整单元54，用于采用转场方法将目标图表替换成调整图表，以使调整图表成为新的目标图表。

优选地，可视化图表页面包括浏览路径。可视化图表页面实现装置还包括权限配置模块60，权限配置模块60包括权限配置请求获取单元61、用户类权限确定单元62和访问权限配置单元63。

权限配置请求获取单元61，用于获取权限配置请求，权限配置请求包括浏览路径和页面类型。

用户类权限确定单元62，用于基于页面类型和预设的页面权限配置表，确定与页面类型相对应的用户类权限。

访问权限配置单元63，用于将浏览路径和用户类权限进行关联，完成浏览路径对应的可视化图表页面的访问权限配置。

优选地，图表页面实现装置还包括安全访问模块70，安全访问模块70包括页面访问请求获取单元71、目标用户类权限获取单元72、目标页面类型获取单元73、目标页面类型判断单元74、页面访问请求响应单元75和页面访问请求拒绝单元76。

页面访问请求获取单元71，用于获取页面访问请求，页面访问请求包括用户ID和目标访问路径。

目标用户类权限获取单元72，用于基于用户ID和预设的用户权限配置表，获取与用户ID相对应的目标用户类权限。

目标页面类型获取单元73，用于基于目标访问路径，获取对应的目标页面类型。

目标页面类型判断单元74，用于基于页面权限配置表，判断目标页面类型是否与目标用户类权限对应。

页面访问请求响应单元75，用于在目标页面类型与目标用户类权限对应时，响应页面访问请求。

页面访问请求拒绝单元76，用于在目标页面类型不与目标用户类权限对应时，拒绝页面访问请求。

实施例3

本实施例提供一计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器执行时实现实施例1中可视化图表页面实现方法，为避免重复，这里不再赘述。或者，该计算机程序被处理器执行时实现实施例2中图表页面实现中各模块/单元的功能，为避免重复，这里不再赘述。

实施例4

图7是本发明一实施例提供的终端设备的示意图。如图7所示，该实施例的终端设备80包括：处理器81、存储器82以及存储在存储器82中并可在处理器81上运行的计算机程序83，处理器81执行计算机程序83时实现如图1所述的步骤S10、S20、S30、S40和S50。或者，处理器81执行计算机程序83时实现实施例2中各模块/单元的功能，例如图6所示图表编辑请求获取模块10、基础图表列表获取模块20、图表选择请求获取模块30、目标图表获取模块40和可视化图表页面获取模块50的功能。

示例性的，计算机程序83可以被分割成一个或多个模块/单元，一个或者多个模块/单元被存储在存储器82中，并由处理器81执行，以完成本发明。一个或多个模块/单元可以是能够完成特定功能的一系列计算机程序指令段，该指令段用于描述计算机程序83在终端设备80中的执行过程。例如，计算机程序83可以被分割成图表编辑请求获取模块10、基础图表列表获取模块20、图表选择请求获取模块30、目标图表获取模块40和可视化图表页面获取模块50。

终端设备80可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。终端设备可包括，但不仅限于，处理器81、存储器82。本领域技术人员可以理解，图7仅仅是终端设备80的示例，并不构成对终端设备80的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件，例如终端设备还可以包括输入输出设备、网络接入设备、总线等。

所称处理器81可以是中央处理单元(Central Processing Unit，CPU)，还可以是其他通用处理器、数字信号处理器(Digital Signal Processor，DSP)、专用集成电路(Application Specific Integrated Circuit，ASIC)、现场可编程门阵列(Field-Programmable Gate Array，FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

存储器82可以是终端设备80的内部存储单元，例如终端设备80的硬盘或内存。存储器82也可以是终端设备80的外部存储设备，例如终端设备80上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(Flash Card)等。进一步地，存储器82还可以既包括终端设备80的内部存储单元也包括外部存储设备。存储器82用于存储计算机程序以及终端设备所需的其他程序和数据。存储器82还可以用于暂时地存储已经输出或者将要输出的数据。

所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，仅以上述各功能单元、模块的划分进行举例说明，实际应用中，可以根据需要而将上述功能分配由不同的功能单元、模块完成，即将所述装置的内部结构划分成不同的功能单元或模块，以完成以上描述的全部或者部分功能。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

所述集成的模块/单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明实现上述实施例方法中的全部或部分流程，也可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一计算机可读存储介质中，该计算机程序在被处理器执行时，可实现上述各个方法实施例的步骤。其中，所述计算机程序包括计算机程序代码，所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质可以包括：能够携带所述计算机程序代码的任何实体或装置、记录介质、U盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、电载波信号、电信信号以及软件分发介质等。需要说明的是，所述计算机可读介质包含的内容可以根据司法管辖区内立法和专利实践的要求进行适当的增减，例如在某些司法管辖区，根据立法和专利实践，计算机可读介质不包括是电载波信号和电信信号。

以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围，均应包含在本发明的保护范围之内。

Claims (10)

1.一种可视化图表页面实现方法，其特征在于，包括：

获取图表编辑请求，所述图表编辑请求包括用户ID和数据来源ID；

基于所述用户ID，获取所述用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示所述基础图表列表；

获取图表选择请求，所述图表选择请求包括图表类型ID和可视化区域ID；

从所述基础图表列表中获取与所述图表类型ID相对应的目标图表，将所述目标图表放置在所述可视化图表配置界面中与所述可视化区域ID相对应的配置区域；

基于所述数据来源ID获取原始数据，采用所述目标图表对所述原始数据进行处理，获取可视化图表页面。

2.如权利要求1所述的可视化图表页面实现方法，其特征在于，所述在可视化图表配置界面中显示所述基础图表列表，包括：

创建至少一个文档对象模型，所述文档对象模型用于存储所述基础图表列表中每一基础图表的图表参数；

基于至少一个所述文档对象模型的图表参数，在所述可视化图表配置界面上渲染出每一所述基础图表对应的缩略图。

3.如权利要求1所述的可视化图表页面实现方法，其特征在于，所述将所述目标图表放置在所述可视化图表配置界面中与所述可视化区域ID相对应的配置区域，包括：

在所述可视化图表配置界面上，采用JQuery UI–draggable插件将所述目标图表拖拽到与所述可视化区域ID相对应的配置区域上。

4.如权利要求1所述的可视化图表页面实现方法，其特征在于，所述采用所述目标图表对所述原始数据进行处理，还包括：

获取图表调整请求，所述图表调整请求包括调整区域ID和调整类型ID；

基于所述调整区域ID，确定与所述调整区域ID相对应的配置区域中的目标图表；

基于所述调整类型ID，在所述基础图表列表中获取与所述调整类型ID相对应的调整图表；

采用转场方法将所述目标图表替换成所述调整图表，以使所述调整图表成为新的目标图表。

5.如权利要求1所述的可视化图表页面实现方法，其特征在于，所述可视化图表页面包括浏览路径；

在所述基于所述数据来源ID获取原始数据，采用所述目标图表对所述原始数据进行处理，获取可视化图表页面的步骤之后，所述可视化图表页面实现方法还包括：

获取权限配置请求，所述权限配置请求包括所述浏览路径和页面类型；

基于所述页面类型和预设的页面权限配置表，确定与所述页面类型相对应的用户类权限；

将所述浏览路径和所述用户类权限进行关联，完成所述浏览路径对应的可视化图表页面的访问权限配置。

6.如权利要求5所述的可视化图表页面实现方法，其特征在于，在所述将所述浏览路径和所述用户类权限进行关联，完成所述浏览路径对应的可视化图表页面的访问权限配置的步骤之后，所述可视化图表页面实现方法还包括：

获取页面访问请求，所述页面访问请求包括用户ID和目标访问路径；

基于所述用户ID和预设的用户权限配置表，获取与所述用户ID相对应的目标用户类权限；

基于所述目标访问路径，获取对应的目标页面类型；

基于所述页面权限配置表，判断所述目标页面类型是否与所述目标用户类权限对应；

若所述目标页面类型与所述目标用户类权限对应，则响应所述页面访问请求；

若所述目标页面类型不与所述目标用户类权限对应，则拒绝所述页面访问请求。

7.一种可视化图表页面实现装置，其特征在于，包括：

图表编辑请求获取模块，用于获取图表编辑请求，所述图表编辑请求包括用户ID和数据来源ID；

基础图表列表获取模块，用于基于所述用户ID，获取所述用户ID对应的权限范围内的基础图表列表，并在可视化图表配置界面中显示所述基础图表列表；

图表选择请求获取模块，用于获取图表选择请求，所述图表选择请求包括图表类型ID和可视化区域ID；

目标图表获取模块，用于从所述基础图表列表中获取与所述图表类型ID相对应的目标图表，将所述目标图表放置在所述可视化图表配置界面中与所述可视化区域ID相对应的配置区域；

可视化图表页面获取模块，用于基于所述数据来源ID获取原始数据，采用所述目标图表对所述原始数据进行处理，获取可视化图表页面。

8.如权利要求7所述的可视化图表页面实现装置，其特征在于，所述可视化图表页面获取模块包括：

图表调整请求获取单元，用于获取图表调整请求，所述图表调整请求包括调整区域ID和调整类型ID；

目标图表确定单元，用于基于所述调整区域ID，确定与所述调整区域ID相对应的配置区域中的目标图表；

调整图表获取单元，用于基于所述调整类型ID，在所述基础图表列表中获取与所述调整类型ID相对应的调整图表；

目标图表调整单元，用于采用转场方法将所述目标图表替换成所述调整图表，以使所述调整图表成为新的目标图表。

9.一种终端设备，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现如权利要求1至6任一项所述可视化图表页面实现方法的步骤。

10.一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现如权利要求1至6任一项所述可视化图表页面实现方法的步骤。