CN103617270B - 大数据量表格在网页上的展现装置和展现方法 - Google Patents

Abstract

本发明提供了一种大数据量表格在网页上的展现装置，包括：后台模型获取模块，获取后台模型，得到需要生成前台代码的后台对象；Css串生成模块，通过前台拼接，生成最终的样式代码即Css串；行列单元格遍历模块，用于根据获取的后台模型和生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。本发明还提供了一种大数据量表格在网页上的展现方法。通过本发明的技术方案，可以在现有的表格在网页上的展现方式基础上，充分利用后台表格模型以最简洁的方式生成html代码、以最小的代价传输要前台的大数据量表格在网页上的展现方式，建立后台表格模型参与的面向大数据量表格在网页上的展现的通用、统一展现思路。

Description

大数据量表格在网页上的展现装置和展现方法

技术领域

本发明涉及计算机技术领域，具体地，涉及一种大数据量表格在网页上的展现装置和一种大数据量表格在网页上的展现方法。

背景技术

由于大部分公司在网页上展现的报表打开速度较慢，需要提供一种快速处理表格展现大数据量的方法，以提高处理大数据量表格效率以最快方式打开页面。

由于数据量大的原因如果用table标记，table标记要解析到对应的</table>才会显示，而div这里就不用。它用由上而下显示出来。

高性能处理大数据量，需要缩短三方面的效率：

（1）后台拼html串，根据模型将css分为三种类型进行拼接，行高度、列宽度、单元属性，这样可以将相同行高、列宽、单元属性css合并从而减少生成的css样式与div上特有的样式。

（2）由于采用div+css布局方法，可以尽量少的生成前台代码，保证网络传输最小的流量。div的加载方式是即读即加载，遇到<div>没有遇到</div>的时候一样加载div中的内容，读多少加载多少。

（3）压缩html代码。

因此，需要一种新的大数据量表格在网页上的展现技术，可以在现有的表格在网页上的展现方式基础上，充分利用后台表格模型以最简洁的方式生成html代码、以最小的代价传输要前台的大数据量表格在网页上的展现方式，建立后台表格模型参与的面向大数据量表格在网页上的展现的通用、统一展现思路。

发明内容

本发明正是基于上述问题，提出了一种新的大数据量表格在网页上的展现技术，可以在现有的表格在网页上的展现方式基础上，充分利用后台表格模型以最简洁的方式生成html代码、以最小的代价传输要前台的大数据量表格在网页上的展现方式，建立后台表格模型参与的面向大数据量表格在网页上的展现的通用、统一展现思路。

有鉴于此，本发明提出了一种大数据量表格在网页上的展现装置，包括：后台模型获取模块，用于获取后台模型，基于获取的后台模型得到需要生成前台代码的后台对象；Css串生成模块，用于通过前台拼接，生成最终的样式代码即Css串；行列单元格遍历模块，用于根据所述后台模型获取模块获取的后台模型和所述Css串生成模块生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，可以将后台表格模型以最简洁的方式生成html代码，以最小的代价传输要前台，从而实现大数据量表格以最简洁的方式传输到前台展现的功能。

在上述技术方案中，优选地，所述大数据量表格在网页上的展现装置，还包括：缓存模块，用于将所述Css串生成模块生成的Css串，进行缓存处理，得到基于所述Css串生成模块生成的Css串经缓存处理后减少的Css串；以及，所述行列单元格遍历模块具体用于：根据所述后台模型获取模块获取的后台模型和所述缓存模块缓存处理得到的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，加入换从，可以减少生成的样式代码，提高效率。

在上述技术方案中，优选地，所行列单元格遍历模块根据所述后台模型获取模块获取的后台模型和所述Css串生成模块生成的Css串，遍历行列单元格得到需要的Css串的操作，具体包括：依次通过生成样式步骤和生成Div步骤，将获取的后台模型生成html代码。

在上述技术方案中，优选地，所述生成样式步骤，具体包括：行单元生成步骤：根据循环取出每一行的高度，当循环取出的每一行的高度不重复时，将该行存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；列单元生成步骤：根据循环取出每一列的宽度，当循环取出的每一列的宽度不重复时，将该列存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；单元格生成步骤：以行列为循环，取出每个单元格的区域对象对应的格式，当取出的每个单元格的行列格式不相同时，将该单元格加入缓存中，对该单元格进行绝对定位，以实现支持不同的浏览器。在该技术方案中，对于行列循环中的每个单元格，通过格式判断使相同格式的单元格只加入一次缓存中，并通过对单元格进行绝对定位，以实现支持不同的浏览器，从而可以对大数据量表格进行高效处理。

在上述技术方案中，优选地，所述生成Div步骤，具体包括：对所述生成样式步骤得到的单元格，通入单元格行列标识，从缓存中取到当前单元格在行、列、单元格上的样式，生成Div；在所述生成Div的操作中，需要确定在行列循环中后台模型某个单元格有数据且有样式后，再生成Div。在该技术方案中，在Div中只需要把取得的样式放入class中，不需要写style由于在样式中已经生成了所有样式，可以提高效率，快速处理表格展现大数据量，提高处理大数据量表格效率以最快方式打开页面。

根据本发明的又一个方面，还提出了一种大数据量表格在网页上的展现方法，包括：步骤202：获取后台模型，基于获取的后台模型得到需要生成前台代码的后台对象；步骤204：通过前台拼接，生成最终的样式代码即Css串；步骤208：根据所述步骤202获取的后台模型和所述步骤204生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，可以将后台表格模型以最简洁的方式生成html代码，以最小的代价传输要前台，从而实现大数据量表格以最简洁的方式传输到前台展现的功能。

在上述技术方案中，优选地，在所述步骤208之前，还包括：步骤206，用于将所述步骤204生成的Css串，进行缓存处理，得到基于所述步骤204生成的Css串经缓存处理后减少的Css串；以及，所述步骤208具体用于：根据所述步骤202获取的后台模型和所述步骤206缓存处理得到的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，加入换从，可以减少生成的样式代码，提高效率。

在上述技术方案中，优选地，所行步骤208根据所述步骤202获取的后台模型和所述步骤204生成的Css串，遍历行列单元格得到需要的Css串的操作，具体包括：依次通过生成样式步骤和生成Div步骤，将获取的后台模型生成html代码。

在上述技术方案中，优选地，所述生成样式步骤，具体包括：行单元生成步骤：根据循环取出每一行的高度，当循环取出的每一行的高度不重复时，将该行存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；列单元生成步骤：根据循环取出每一列的宽度，当循环取出的每一列的宽度不重复时，将该列存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；单元格生成步骤：以行列为循环，取出每个单元格的区域对象对应的格式，当取出的每个单元格的行列格式不相同时，将该单元格加入缓存中，对该单元格进行绝对定位，以实现支持不同的浏览器。在该技术方案中，对于行列循环中的每个单元格，通过格式判断使相同格式的单元格只加入一次缓存中，并通过对单元格进行绝对定位，以实现支持不同的浏览器，从而可以对大数据量表格进行高效处理。

在上述技术方案中，优选地，所述生成Div步骤，具体包括：对所述生成样式步骤得到的单元格，通入单元格行列标识，从缓存中取到当前单元格在行、列、单元格上的样式，生成Div；在所述生成Div的操作中，需要确定在行列循环中后台模型某个单元格有数据且有样式后，再生成Div。在该技术方案中，在Div中只需要把取得的样式放入class中，不需要写style由于在样式中已经生成了所有样式，可以提高效率，快速处理表格展现大数据量，提高处理大数据量表格效率以最快方式打开页面。

通过以上技术方案，可以在现有的表格在网页上的展现方式基础上，充分利用后台表格模型以最简洁的方式生成html代码、以最小的代价传输要前台的大数据量表格在网页上的展现方式，建立后台表格模型参与的面向大数据量表格在网页上的展现的通用、统一展现思路。

附图说明

图1示出了根据本发明的实施例的大数据量表格在网页上的展现装置的框图；

图2示出了根据本发明的实施例的大数据量表格在网页上的展现方法的流程图；

图3示出了根据本发明的实施例的大数据量表格在网页上的展现装置的具体逻辑处理流程图。

具体实施方式

为了能够更清楚地理解本发明的上述目的、特征和优点，下面结合附图和具体实施方式对本发明进行进一步的详细描述。需要说明的是，在不冲突的情况下，本申请的实施例及实施例中的特征可以相互组合。

在下面的描述中阐述了很多具体细节以便于充分理解本发明，但是，本发明还可以采用其他不同于在此描述的其他方式来实施，因此，本发明的保护范围并不受下面公开的具体实施例的限制。

图1示出了根据本发明的实施例的大数据量表格在网页上的展现装置的框图。

如图1所示，根据本发明的实施例的大数据量表格在网页上的展现装置100，包括：后台模型获取模块102，用于获取后台模型，基于获取的后台模型得到需要生成前台代码的后台对象；Css串生成模块104，用于通过前台拼接，生成最终的样式代码即Css串；行列单元格遍历模块108，用于根据后台模型获取模块102获取的后台模型和Css串生成模块104生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，可以将后台表格模型以最简洁的方式生成html代码，以最小的代价传输要前台，从而实现大数据量表格以最简洁的方式传输到前台展现的功能。

在上述技术方案中，优选地，大数据量表格在网页上的展现装置，还包括：缓存模块106，用于将Css串生成模块104生成的Css串，进行缓存处理，得到基于Css串生成模块104生成的Css串经缓存处理后减少的Css串；以及，行列单元格遍历模块108具体用于：根据后台模型获取模块102获取的后台模型和缓存模块106缓存处理得到的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，加入换从，可以减少生成的样式代码，提高效率。

在上述技术方案中，优选地，所行列单元格遍历模块108根据后台模型获取模块102获取的后台模型和Css串生成模块104生成的Css串，遍历行列单元格得到需要的Css串的操作，具体包括：依次通过生成样式步骤和生成Div步骤，将获取的后台模型生成html代码。

在上述技术方案中，优选地，生成样式步骤，具体包括：行单元生成步骤：根据循环取出每一行的高度，当循环取出的每一行的高度不重复时，将该行存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；列单元生成步骤：根据循环取出每一列的宽度，当循环取出的每一列的宽度不重复时，将该列存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；单元格生成步骤：以行列为循环，取出每个单元格的区域对象对应的格式，当取出的每个单元格的行列格式不相同时，将该单元格加入缓存中，对该单元格进行绝对定位，以实现支持不同的浏览器。在该技术方案中，对于行列循环中的每个单元格，通过格式判断使相同格式的单元格只加入一次缓存中，并通过对单元格进行绝对定位，以实现支持不同的浏览器，从而可以对大数据量表格进行高效处理。

在上述技术方案中，优选地，生成Div步骤，具体包括：对生成样式步骤得到的单元格，通入单元格行列标识，从缓存中取到当前单元格在行、列、单元格上的样式，生成Div；在生成Div的操作中，需要确定在行列循环中后台模型某个单元格有数据且有样式后，再生成Div。在该技术方案中，在Div中只需要把取得的样式放入class中，不需要写style由于在样式中已经生成了所有样式，可以提高效率，快速处理表格展现大数据量，提高处理大数据量表格效率以最快方式打开页面。

图2示出了根据本发明的实施例的大数据量表格在网页上的展现方法的流程图。

如图2所示，根据本发明的实施例的大数据量表格在网页上的展现方法，包括：步骤202：获取后台模型，基于获取的后台模型得到需要生成前台代码的后台对象；步骤204：通过前台拼接，生成最终的样式代码即Css串；步骤208：根据步骤202获取的后台模型和步骤204生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，可以将后台表格模型以最简洁的方式生成html代码，以最小的代价传输要前台，从而实现大数据量表格以最简洁的方式传输到前台展现的功能。

在上述技术方案中，优选地，在步骤208之前，还包括：步骤206，用于将步骤204生成的Css串，进行缓存处理，得到基于步骤204生成的Css串经缓存处理后减少的Css串；以及，步骤208具体用于：根据步骤202获取的后台模型和步骤206缓存处理得到的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。在该技术方案中，加入换从，可以减少生成的样式代码，提高效率。

在上述技术方案中，优选地，所行步骤208根据步骤202获取的后台模型和步骤204生成的Css串，遍历行列单元格得到需要的Css串的操作，具体包括：依次通过生成样式步骤和生成Div步骤，将获取的后台模型生成html代码。

在上述技术方案中，优选地，生成样式步骤，具体包括：行单元生成步骤：根据循环取出每一行的高度，当循环取出的每一行的高度不重复时，将该行存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；列单元生成步骤：根据循环取出每一列的宽度，当循环取出的每一列的宽度不重复时，将该列存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；单元格生成步骤：以行列为循环，取出每个单元格的区域对象对应的格式，当取出的每个单元格的行列格式不相同时，将该单元格加入缓存中，对该单元格进行绝对定位，以实现支持不同的浏览器。在该技术方案中，对于行列循环中的每个单元格，通过格式判断使相同格式的单元格只加入一次缓存中，并通过对单元格进行绝对定位，以实现支持不同的浏览器，从而可以对大数据量表格进行高效处理。

在上述技术方案中，优选地，生成Div步骤，具体包括：对生成样式步骤得到的单元格，通入单元格行列标识，从缓存中取到当前单元格在行、列、单元格上的样式，生成Div；在生成Div的操作中，需要确定在行列循环中后台模型某个单元格有数据且有样式后，再生成Div。在该技术方案中，在Div中只需要把取得的样式放入class中，不需要写style由于在样式中已经生成了所有样式，可以提高效率，快速处理表格展现大数据量，提高处理大数据量表格效率以最快方式打开页面。

本申请的技术方案中，约定一些术语，具体说明如下：

大数据量表格：指表格的列数与行数数量和数据复杂度。具体逻辑处理流程如图3所示。

获取后台模型：得到需要生成前台代码的后台对象。

遍历行列单元格：得到需要的样式代码，用来拼接前台页面。

加入缓存：提高效率，减少生成的样式代码。

生成Css串：用于前台拼接生成最终的样式代码。

在本发明的技术方案中，将后台模型生成html代码，处理过程可分为两部分：“生成样式”，“生成Div”，具体说明如下：

⑴首先介绍“生成样式”方法，将生成样式拆分成三种方式生成，分别为：“行单元”、“列单元”、“单元格”。

行单元：根据循环取出每一行的高度，判断高度是否重复，如不重复存入缓存中，生成样式代码，减少生成的样式代码。

列单元：根据循环取出每一列的宽度，判断宽度是否重复，如不重复存入缓存中，生成样式代码，减少生成的样式代码。

单元格：以行列为循环，取出每个单元格的区域对象对应的格式，增加格式判断使相同格式的单元格只加入一次缓存中，同时增加单元格的绝对定位以实现支持不同的浏览器。

⑵“生成Div”：通入单元格行列标识，可以从缓存中取到当前单元格在行、列、单元格上的样式可生成Div。在Div中只需要把取得的样式放入class中，不需要写style由于在样式中已经生成了所有样式。

在生成Div同时判断后台模型某个单元格是否有数据，是否有样式。如果没有数据且没有样式，这个单元格即使在行列循环中，也将不被生成Div。

例如，当前模型表格如下：

又如，生成前台页面表格如下：

在本发明的技术方案中，通过测试万行数据转换成报表的时间为3秒左右。

本发明的技术方案，已在实际应用中验证（如用于用友BAP分析平台），可以将后台表格模型以最简洁的方式生成html代码，以最小的代价传输要前台，可以实现大数据量表格以最简洁的方式传输到前台展现的功能，是高性能处理大数据量表格在网页上的展现技术。

以上结合附图详细说明了本发明的技术方案，考虑到相关技术中没有简便的、统一的针对大数据量表格在网页上展现的解决办法。现有的表格在网页上的展现无法完成有大数据量表格参与的表格在网页上的展现过程。因此，本发明提出了一种大数据量表格在网页上的展现装置和一种大数据量表格在网页上的展现方法，可以在现有的表格在网页上的展现方式基础上，充分利用后台表格模型以最简洁的方式生成html代码、以最小的代价传输要前台的大数据量表格在网页上的展现方式，建立后台表格模型参与的面向大数据量表格在网页上的展现的通用、统一展现思路。

以上所述仅为本发明的优选实施例而已，并不用于限制本发明，对于本领域的技术人员来说，本发明可以有各种更改和变化。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (8)

1.一种大数据量表格在网页上的展现装置，其特征在于，包括：

后台模型获取模块，用于获取后台模型，基于获取的后台模型得到需要生成前台代码的后台对象；

Css串生成模块，用于通过前台拼接，生成最终的样式代码即Css串；

行列单元格遍历模块，用于根据所述后台模型获取模块获取的后台模型和所述Css串生成模块生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面；

还包括：

缓存模块，用于将所述Css串生成模块生成的Css串，进行缓存处理，得到基于所述Css串生成模块生成的Css串经缓存处理后减少的Css串；以及，

所述行列单元格遍历模块具体用于：根据所述后台模型获取模块获取的后台模型和所述缓存模块缓存处理得到的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。

2.根据权利要求1所述的大数据量表格在网页上的展现装置，其特征在于，所述行列单元格遍历模块根据所述后台模型获取模块获取的后台模型和所述Css串生成模块生成的Css串，遍历行列单元格得到需要的Css串的操作，具体包括：依次通过生成样式步骤和生成Div步骤，将获取的后台模型生成html代码。

3.根据权利要求2所述的大数据量表格在网页上的展现装置，其特征在于，所述生成样式步骤，具体包括：

行单元生成步骤：根据循环取出每一行的高度，当循环取出的每一行的高度不重复时，将该行存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；

列单元生成步骤：根据循环取出每一列的宽度，当循环取出的每一列的宽度不重复时，将该列存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；

单元格生成步骤：以行列为循环，取出每个单元格的区域对象对应的格式，当取出的每个单元格的行列格式不相同时，将该单元格加入缓存中，对该单元格进行绝对定位，以实现支持不同的浏览器。

4.根据权利要求2所述的大数据量表格在网页上的展现装置，其特征在于，所述生成Div步骤，具体包括：

对所述生成样式步骤得到的单元格，通入单元格行列标识，从缓存中取到当前单元格在行、列、单元格上的样式，生成Div；

在所述生成Div的操作中，需要确定在行列循环中后台模型某个单元格有数据且有样式后，再生成Div。

5.一种大数据量表格在网页上的展现方法，其特征在于，包括：

步骤202：获取后台模型，基于获取的后台模型得到需要生成前台代码的后台对象；

步骤204：通过前台拼接，生成最终的样式代码即Css串；

步骤208：根据所述步骤202获取的后台模型和所述步骤204生成的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面;

在所述步骤208之前，还包括：

步骤206，用于将所述步骤204生成的Css串，进行缓存处理，得到基于所述步骤204生成的Css串经缓存处理后减少的Css串；以及，

所述步骤208具体用于：根据所述步骤202获取的后台模型和所述步骤206缓存处理得到的Css串，遍历行列单元格得到需要的Css串，用于拼接前台页面。

6.根据权利要求5所述的大数据量表格在网页上的展现方法，其特征在于，所述步骤208根据所述步骤202获取的后台模型和所述步骤204生成的Css串，遍历行列单元格得到需要的Css串的操作，具体包括：依次通过生成样式步骤和生成Div步骤，将获取的后台模型生成html代码。

7.根据权利要求6所述的大数据量表格在网页上的展现方法，其特征在于，所述生成样式步骤，具体包括：

行单元生成步骤：根据循环取出每一行的高度，当循环取出的每一行的高度不重复时，将该行存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；

列单元生成步骤：根据循环取出每一列的宽度，当循环取出的每一列的宽度不重复时，将该列存入缓存中，生成样式代码，并经缓存处理减少生成的样式代码；

单元格生成步骤：以行列为循环，取出每个单元格的区域对象对应的格式，当取出的每个单元格的行列格式不相同时，将该单元格加入缓存中，对该单元格进行绝对定位，以实现支持不同的浏览器。

8.根据权利要求6所述的大数据量表格在网页上的展现方法，其特征在于，所述生成Div步骤，具体包括：

对所述生成样式步骤得到的单元格，通入单元格行列标识，从缓存中取到当前单元格在行、列、单元格上的样式，生成Div；

在所述生成Div的操作中，需要确定在行列循环中后台模型某个单元格有数据且有样式后，再生成Div。