CN103279564A - 基于html的图表数据输出方法及装置 - Google Patents

Abstract

本发明提供一种基于HTML的图表数据输出方法及装置，其中，所述方法包括：S1、输出统计图表，所述统计图表包括一数据节点；S2、在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询；S3、接收对所述数据节点的触发条件；S4、将所述查询要素在所述原始数据中进行查询；S5、输出与所述数据节点匹配的明细记录。与现有技术相比，本发明的基于HTML的图表数据输出方法及装置可自动匹配与图表中的数据节点相应的明细记录，有效提升了明细记录查询的准确性，以及明细记录的查询和输出效率。

Description

基于HTML的图表数据输出方法及装置

技术领域

本发明涉及一种基于HTML的图表数据输出方法及装置，特别涉及一种应用于政府企业交互平台的基于HTML的图表数据输出方法及装置。

背景技术

数据可视化显示是当前工业领域、商业领域、金融领域等不可或缺的元素。其通常采用图表进行数据可视化的展示，其可直观地显示统计分析后的数据。

然而，现有的基于HTML的图表数据，只能通过图表展现统计分析后的统计数值，并无法根据该统计数值获得与该统计数值匹配的明细记录。

发明内容

为解决上述技术问题，本发明的目的在于提供一种基于HTML的图表数据输出方法及装置，该方法、装置可通过数据节点自动匹配与该数据节点相应的明细记录。

相应地，本发明第一实施方式的基于HTML的图表数据输出方法，所述方法包括以下步骤：S1、输出统计图表，所述统计图表包括一数据节点；S2、在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询。

作为本发明的进一步改进，在所述S2步骤后，还包括：S3、接收对所述数据节点的触发条件；S4、将所述查询要素在所述原始数据中进行查询；S5、输出与所述数据节点匹配的明细记录。

作为本发明的进一步改进，将所述查询要素通过代码对照或预设标识进行分析，组织成为查询关键词；将所述查询关键词在所述原始数据中进行查询。

作为本发明的进一步改进，将与所述数据节点匹配的明细记录存储于本地内存中，并绑定列表控件。 

作为本发明的进一步改进，在S1步骤前，包括：获取原始数据，并统计分析所述原始数据后，生成结果集，所述结果集包括一数据节点及所述数据节点的值；调用图表控件，并根据所述结果集形成统计图表。 

相应地，本发明一种实施方式的基于HTML的图表数据输出装置，包括：输出单元，用于输出统计图表，所述统计图表包括一数据节点；以及，在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询。

作为本发明的进一步改进，指令单元，用于接收对所述数据节点的触发条件；查询单元，用于将所述查询要素在所述原始数据中进行查询；所述输出单元还用于输出与所述数据节点匹配的明细记录。 

作为本发明的进一步改进，将所述查询要素通过代码对照或预设标识进行分析，组织成为查询关键词；将所述查询关键词在所述原始数据中进行查询。

作为本发明的进一步改进，存储单元，用于将与所述数据节点匹配的明细记录存储于本地内存中，并绑定列表控件。

作为本发明的进一步改进，图表生成单元，用于获取原始数据，并统计分析所述原始数据后，生成结果集，所述结果集包括一数据节点及所述数据节点的值；以及用于调用图表控件，以根据所述结果集形成图表。

与现有技术相比，本发明的基于HTML的图表数据输出方法及装置可自动匹配与图表中的数据节点相应的明细记录，有效提升了明细记录查询的准确性，以及明细记录的查询和输出效率。

附图说明

图1是本发明一实施方式中基于HTML的图表数据输出方法的流程图；

图2是本发明一实施方式中基于HTML的图表数据输出装置的模块图；

图3是本发明一实施方式中基于HTML的图表数据输出方法所输出的统计图表的示意图。

图4是本发明一实施方式中基于HTML的图表数据输出方法所输出的明细记录的示意图。

具体实施方式

以下将结合附图所示的各实施方式对本发明进行详细描述。但这些实施方式并不限制本发明，本领域的普通技术人员根据这些实施方式所做出的结构、方法、或功能上的变换均包含在本发明的保护范围内。

如图1所示，在本发明一实施方式中，所述基于HTML的图表数据输出方法包括：

S1、输出统计图表，所述统计图表包括一数据节点；具体的，可先获取后台的原始数据，并统计分析所述原始数据后，生成结果集，所述结果集包括一数据节点及与所述数据节点相应的值。一般的，该原始数据为存储于数据库或存储单元中的明细记录。在获取到所述明细记录时，可根据需要分析的类型，例如，按照行政区域划分的2013年新增投资项目。按照预定的筛选条件，对该明细记录进行分析统计，以将该明细记录形成可用于生成图表的数据节点和与该数据节点相应的值，例如，可根据不同行政区域名称在所述原始数据中进行检索，并得到相应的数据节点和值：A区域2013年新增投资项目372笔，B区域2013年新增投资项目162笔，C区域172笔，D区域49笔，E区域22笔。

其次，调用图表控件，并根据所述结果集形成统计图表。所述统计图表可为经过预先设定的类型，如柱状图、条形图、折线图、扇形图等。例如：所述统计图表是基于上述数据生成的扇形图，所述扇形图中包括若干个数据节点，如图3所示，每一个行政区域可表示为一个扇形区，每个扇形区都是一个数据节点，且每个扇形区都显示有该数据节点所对应的值。

S2、在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询。具体的，所述查询要素是一组由一个或多个参数组成的指令，所述指令可以是一串脚本字符串，分别赋予在每一个数据节点上，组成该脚本字符串的参数包括数据节点本身通过数据源绑定的数据，一般为代码或识别码，也包括图表统计的类型、时间范围等。优选地，该查询要素可为形成该数据节点和数据节点的值的预设条件。如此，即可最准确的获得与数据节点相应的明细记录。

在所述统计图表、数据节点、查询要素以HTML输出后，本方法还包括：

S3、接收对所述数据节点的触发条件；一般的，所述触发条件可以是用户通过鼠标点击数据节点或将鼠标移至数据节点区域等多种操作，例如：用户单击上述内容中的A区域或A区域所对应的值，具有这样的触发条件的目的是，当用户需要了解统计图表上的数据节点的明细记录时，不需要另外提供相应的查询条件设定栏目和查询按钮进行查询，这样就不会因用户的查询条件设定与形成该数据节点和数据节点的值的预设条件有偏差，导致查询到的明细记录和数据节点不匹配。同时，也会可提升查询效率。

S4、将所述查询要素在所述原始数据中进行查询；具体的，所述数据节点上隐性包含的查询要素通过代码对照或预设标识进行分析，组织成为查询关键词，将所述查询关键词在所述原始数据中进行查询。一般的，通过Javascrip传值的方式，将由一个或多个参数组成的查询要素传递，所述查询要素通过代码对照或预设标识进行分析，组织成为查询关键词，例如：上述内容的按照行政区域划分的2013年新增投资项目，对应A区域2013年新增投资项目372笔赋予一串脚本字符串，即是查询要素，该查询要素通过代码对照或预设标识进行分析，生成查询关键词为：时间：2013，区域：A，并以对应生成的查询关键词在所述原始数据中进行查询，相应的查询关键词自动匹配原始数据中所包含的A区域的详细明细进行查询。

S5、输出与所述数据节点相应的明细记录。例如，如图4所示，通过上述查询关键词查询到的在2013年，A区域中新增投资公司的组织机构代码，000000001、企业名称，A公司、注册资本，200万等。优选地，可将与所述数据节点匹配的明细记录存储于本地内存中，并绑定列表控件，例如，将原始数据中交互获取的查询结果发送至本地内存，再将在本地内存中生成的匹配所述数据节点的明细记录输出。

所述本地内存用于数据中转，其可以使用户在不刷新页面的情况下即时看到明细记录，节约网络流量，提高浏览效率。所述列表控件是一种转换工具，可将交互获取的查询结果转换成具体的明细记录展示。需要说明的是，在整个实施过程中，也可以将通过在原始数据中交互获取的查询结果绑定列表控件后直接输出即不经过本地内存中转，该种实施方式要经过页面刷新，之后显示明细记录。

所述明细记录是匹配统计图表中某一个数据节点所包含的具体数据，可以有表格，图表，文字等多种表现形式。优选地，该明细记录的输出文件格式与原始数据格式相同。所述明细记录中也可以包含下一级数据节点，例如：上述内容中描述的A区域2013年新增投资项目372笔的具体数据以表格的形式体现，组成表格的行包含：组织机构代码，企业名称，注册资本等，组成表格的列由组织机构代码，企业名称，注册资本等所包含的详细信息：组织机构代码，000000001、企业名称，A公司、注册资本，200万等组成。相应的，行列交叉所组成的单元格中的详细信息也可包含下一级的查询要素，对该单元格的查询和输出方式和上述内容相近似，在此不做详细赘述。

需要说明的是，上述过程中S1、S2步骤是可先后执行，也可以同时执行。

通过上述方案的描述，可以优选利用Ajax技术，基于javascrip和xml与存储原始数据的服务器进行异步通信，将通过在原始数据中交互获取的查询结果存储到本地内存中，并通绑定girdview列表，将明细记录输出。

如图2所示，在本发明一实施方式中，基于HTML的图表数据输出装置包括：

图表生成单元100，所述图表生成单元100用于获取后台的原始数据，并统计分析所述原始数据后，生成结果集，所述结果集包括一数据节点及与所述数据节点相应的值。一般的，该原始数据为存储于数据库或存储单元中的明细记录。在获取到所述明细记录时，可根据需要分析的类型，例如，按照行政区域划分的2013年新增投资项目。按照预定的筛选条件，对该明细记录进行分析统计，以将该明细记录形成可用于生成图表的数据节点和与该数据节点相应的值，例如，可根据不同行政区域名称在所述原始数据中进行检索，并得到相应的数据节点和值：A区域2013年新增投资项目372笔，B区域2013年新增投资项目162笔，C区域172笔，D区域49笔，E区域22笔。

所述图表生成单元100还用于调用图表控件，以根据所述结果集形成统计图表。所述统计图表可为经过预先设定的类型，如柱状图、条形图、折线图、扇形图等。例如：所述统计图表是基于上述数据生成的扇形图，所述扇形图中包括若干个数据节点，如图3所示，每一个行政区域可表示为一个扇形区，每个扇形区都是一个数据节点，且每个扇形区都显示有该数据节点所对应的值。

输出单元200，用于输出统计图表，所述统计图表包括一数据节点；以及，在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询。具体的，所述查询要素是一组由一个或多个参数组成的指令，所述指令可以是一串脚本字符串，分别赋予在每一个数据节点上，组成该脚本字符串的参数包括数据节点本身通过数据源绑定的数据，一般为代码或识别码，也包括图表统计的类型、时间范围等。优选地，该查询要素可为形成该数据节点和数据节点的值的预设条件。如此，即可最准确的获得与数据节点相应的明细记录。

所述输出单元200还用于输出与所述数据节点匹配的明细记录。

所述明细记录是匹配统计图表中某一个数据节点所包含的具体数据，可以有表格，图表，文字等多种表现形式。优选地，该明细记录的输出文件格式与原始数据格式相同。所述明细记录中也可以包含下一级数据节点，例如： A区域2013年新增投资项目372笔的具体数据以表格的形式体现，组成表格的行包含：组织机构代码，企业名称，注册资本等，组成表格的列由组织机构代码，企业名称，注册资本等所包含的详细信息：组织机构代码，000000001、企业名称，A公司、注册资本，200万等组成。相应的，行列交叉所组成的单元格中的详细信息也可包含下一级的查询要素，对该单元格的查询和输出方式和上述内容相近似，在此不做详细赘述。

指令单元300，所述指令单元300用于接收对所述数据节点的触发条件；一般的，所述触发条件可以是用户通过鼠标点击数据节点或将鼠标移至数据节点区域等多种操作，例如：用户单击上述内容中的A区域或A区域所对应的值，具有这样的触发条件的目的是，当用户需要了解统计图表上的数据节点的明细记录时，不需要另外提供相应的查询条件设定栏目和查询按钮进行查询，这样就不会因用户的查询条件设定与形成该数据节点和数据节点的值的预设条件有偏差，导致查询到的明细记录和数据节点不匹配。同时，也会可提升查询效率。

查询单元400，用于将所述查询要素在所述原始数据中进行查询。具体的，所述查询单元400将通过指令单元300发送过来的查询要素通过代码对照或预设标识进行分析，组织成为查询关键词，将所述查询关键词在所述原始数据中进行查询。所述数据节点上隐性包含的查询要素通过代码对照或预设标识进行分析，组织成为查询关键词，将所述查询关键词在所述原始数据中进行查询。一般的，通过Javascrip传值的方式，将由一个或多个参数组成的查询要素传递，所述查询要素通过代码对照或预设标识进行分析，组织成为查询关键词，例如：上述内容的按照行政区域划分的2013年新增投资项目，对应A区域2013年新增投资项目372笔赋予一串脚本字符串，即是查询要素，该查询要素通过代码对照或预设标识进行分析，生成查询关键词为：时间：2013，区域：A，并以对应生成的查询关键词在所述原始数据中进行查询，相应的查询关键词自动匹配原始数据中所包含的A区域的详细明细进行查询。

存储单元500，所述存储单元500用于将与所述数据节点匹配的明细记录存储于本地内存中，并绑定列表控件。例如，如图4所示，通过查询关键词查询到的在2013年，A区域中新增投资公司的组织机构代码，000000001、企业名称，A公司、注册资本，200万等。优选地，所述存储单元500用于存储与所述数据节点匹配的明细记录，并绑定列表控件，例如，将原始数据中交互获取的查询结果发送至存储单元500中，再将与存储单元500中生成的匹配所述数据节点的明细记录输出。

所述存储单元500是用于数据中转的空间，其可以使用户在不刷新页面的情况下即时看到明细记录，节约网络流量，提高浏览效率。所述列表控件是一种转换工具，可将交互获取的查询结果转换成具体的明细记录展示。需要说明的是，在整个实施过程中，也可以将通过在原始数据中交互获取的查询结果绑定列表控件后直接输出即不经过存储单元500中转，该种实施方式要经过页面刷新，之后显示明细记录。

具体的，通过所述图表生成单元100生成的统计图表和具体明细，都是与公用的输出单元200约定好，能够被输出单元200完全读取；

相应的，所述输出单元200可以div层或嵌入页面等多种形式存在，例如：输出单元200上同时展示所述统计图表和所述统计图表隐性包含的明细记录；也可以跳转页面，在另一个页面上展示明细记录。

与现有技术相比，本发明的基于HTML的图表数据输出方法及装置可自动匹配与图表中的数据节点相应的明细记录，有效提升了明细记录查询的准确性，以及明细记录的查询和输出效率。

为了描述的方便，描述以上装置时以功能分为各种模块分别描述。当然，在实施本申请时可以把各模块的功能在同一个或多个软件和/或硬件中实现。

通过以上的实施方式的描述可知，本领域的技术人员可以清楚地了解到本申请可借助软件加必需的通用硬件平台的方式来实现。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以保存在保存介质中，如ROM/RAM、磁碟、光盘等，包括若干指令用以使得一台计算机设备（可以是个人计算机，信息推送服务器，或者网络设备等）执行本申请各个实施方式或者实施方式的某些部分所述的方法。

以上所描述的装置实施方式仅仅是示意性的，其中所述作为分离部件说明的模块可以是或者也可以不是物理上分开的，作为模块显示的部件可以是或者也可以不是物理模块，即可以位于一个地方，或者也可以分布到多个网络模块上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施方式方案的目的。本领域普通技术人员在不付出创造性劳动的情况下，即可以理解并实施。

本申请可用于众多通用或专用的计算系统环境或配置中。例如：个人计算机、信息推送服务器计算机、手持设备或便携式设备、平板型设备、多处理模块系统、基于微处理模块的系统、置顶盒、可编程的消费电子设备、网络PC、小型计算机、大型计算机、包括以上任何系统或设备的分布式计算环境等等。

本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述，例如程序模块。一般地，程序模块包括执行特定任务或实现特定抽象数据类型的例程、程序、对象、组件、数据结构等等。也可以在分布式计算环境中实践本申请，在这些分布式计算环境中，由通过通信网络而被连接的远程处理设备来执行任务。在分布式计算环境中，程序模块可以位于包括保存设备在内的本地和远程计算机保存介质中。

应当理解，虽然本说明书按照实施方式加以描述，但并非每个实施方式仅包含一个独立的技术方案，说明书的这种叙述方式仅仅是为清楚起见，本领域技术人员应当将说明书作为一个整体，各实施方式中的技术方案也可以经适当组合，形成本领域技术人员可以理解的其他实施方式。

上文所列出的一系列的详细说明仅仅是针对本发明的可行性实施方式的具体说明，它们并非用以限制本发明的保护范围，凡未脱离本发明技艺精神所作的等效实施方式或变更均应包含在本发明的保护范围之内。

Claims (10)

1.一种基于HTML的图表数据输出方法，其特征在于，所述方法包括以下步骤：

S1、输出统计图表，所述统计图表包括一数据节点；

S2、在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询。

2.根据权利要求1所述的基于HTML的图表数据输出方法，其特征在于，在所述S2步骤后，还包括：

S3、接收对所述数据节点的触发条件；

S4、将所述查询要素在所述原始数据中进行查询；

S5、输出与所述数据节点匹配的明细记录。

3.根据权利要求2所述的基于HTML的图表数据输出方法，其特征在于，所述“将所述查询要素在所述原始数据中进行查询”步骤，具体包括：

将所述查询要素通过代码对照或预设标识进行分析，组织成为查询关键词；

将所述查询关键词在所述原始数据中进行查询。

4.根据权利要求2所述的基于HTML的图表数据输出方法，其特征在于，所述方法还包括：

将与所述数据节点匹配的明细记录存储于本地内存中，并绑定列表控件。

5.根据权利要求1所述的基于HTML的图表数据输出方法，其特征在于，在S1步骤前，包括：

获取原始数据，并统计分析所述原始数据后，生成结果集，所述结果集包括一数据节点及所述数据节点的值；

调用图表控件，并根据所述结果集形成统计图表。

6.一种基于HTML的图表数据输出装置，其特征在于，所述装置包括：

输出单元，用于输出统计图表，所述统计图表包括一数据节点；

以及，在所述数据节点上赋予与所述数据节点相应的查询要素，所述查询要素可对生成所述统计图表的原始数据进行查询。

7.根据权利要求6所述的基于HTML的图表数据输出装置，其特征在于，所述装置还包括：

指令单元，用于接收对所述数据节点的触发条件；

查询单元，用于将所述查询要素在所述原始数据中进行查询；

所述输出单元还用于输出与所述数据节点匹配的明细记录。

8.根据权利要求7所述的基于HTML的图表数据输出装置，其特征在于，所述查询单元用于：

将所述查询要素通过代码对照或预设标识进行分析，组织成为查询关键词；

将所述查询关键词在所述原始数据中进行查询。

9.根据权利要求7所述的基于HTML的图表数据输出装置，其特征在于，所述装置还包括：

存储单元，用于将与所述数据节点匹配的明细记录存储于本地内存中，并绑定列表控件。

10.根据权利要求6所述的基于HTML的图表数据输出装置，其特征在于，所述装置还包括：

图表生成单元，用于获取原始数据，并统计分析所述原始数据后，生成结果集，所述结果集包括一数据节点及所述数据节点的值；

以及用于调用图表控件，以根据所述结果集形成图表。

Images