CN117557682A - 数据处理方法、装置、产品、设备和介质 - Google Patents

Abstract

本申请公开了一种数据处理方法、装置、产品、设备和介质，该方法包括：获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，各个图形元素在第一画布中有对应的元素位置；第一画布的尺寸为动态尺寸；获取第一画布中的可视区域，基于可视区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选第一图形元素；在第一画布中绘制第一图形元素，根据绘制的位于可视区域内的第二图形元素，从原始数据集中筛选出目标原始数据；在第二画布中显示第二图形元素及目标原始数据。采用本申请，可提升对图形元素进行绘制显示的性能。

Description

数据处理方法、装置、产品、设备和介质

技术领域

本申请涉及计算机技术领域，尤其涉及一种数据处理方法、装置、产品、设备和介质。

背景技术

图表可以是通过相关的图形元素进行渲染显示，通过图形元素对图表进行渲染显示的过程，即为绘制显示图形元素的过程。

现有应用中，是在图形画布上一次性绘制全部的图形画布，并在图形画布上显示所绘制的全部图形画布，而当存在大量需要被绘制的图形元素时，采用此种方式进行图形元素的绘制就会非常的耗时，导致图形元素的显示也会有很大延迟，从而导致对图形元素进行绘制显示的性能就会很差。

发明内容

本申请提供了一种数据处理方法、装置、产品、设备和介质，可提升对图形元素进行绘制显示的性能。

本申请一方面提供了一种数据处理方法，该方法包括：

获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；

获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；

在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；

在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。

本申请一方面提供了一种数据处理装置，该装置包括：

第一获取模块，用于获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；

第二获取模块，用于获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；

绘制模块，用于在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；

显示模块，用于在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。

可选的，第一画布的尺寸被延伸至目标尺寸，目标尺寸是能够容纳基于图形元素集所需绘制的所有图表的尺寸；

其中，可视区域的尺寸小于或等于目标尺寸，可视区域的尺寸与第二画布的尺寸相同。

可选的，第一获取模块获取图形元素集的流程，包括：

获取展示原始数据集中的原始数据所需图表的目标类型，并获取目标类型的图表的配置数据；

基于原始数据集对配置数据进行解析处理，得到图形元素集。

可选的，若图形元素集中的一个图形元素是基于原始数据集中的一个或多个原始数据解析得到的，则该图形元素与一个或多个原始数据之间具有关联关系；

绘制模块根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据的方式，包括：

从原始数据集中，筛选出与第二图形元素具有关联关系的原始数据，作为目标原始数据。

可选的，第二画布显示于终端界面上，终端界面上包含第一滚动条和第二滚动条，第一滚动条用于在第一方向上对可视区域进行滚动变化，第二滚动条用于在第二方向上对可视区域进行滚动变化；第一滚动条用于滚动的总距离等于第一画布在第一方向上的尺寸，第二滚动条用于滚动的总距离等于第一画布在第二方向上的尺寸；

第二获取模块获取第一画布中的可视区域的方式，包括：

获取第一滚动条所滚动的第一距离及第二滚动条所滚动的第二距离；

基于第一距离和第二距离，在第一画布中确定可视区域。

可选的，第一画布具有坐标系，坐标系包括第一方向上的第一坐标轴、及第二方向上的第二坐标轴；第二获取模块基于第一距离和第二距离，在第一画布中确定可视区域的方式，包括：

基于第一距离获取第一坐标值，并基于第二距离获取第二坐标值；第一坐标值用于在第一坐标轴上指示可视区域在第一画布中的位置，第二坐标值用于在第二坐标轴上指示可视区域在第一画布中的位置；

基于第一坐标值和第二坐标值，构建坐标系中的目标坐标；

其中，可视区域在第一画布中的位置是由目标坐标和可视区域的尺寸进行结合确定。

可选的，第二获取模块基于第一距离获取第一坐标值，并基于第二距离获取第二坐标值的方式，包括：

获取可视区域在第一方向上的第一初始坐标值，并对第一初始坐标值与第一距离进行加和处理，得到第一坐标值；以及，

获取可视区域在第二方向上的第二初始坐标值，并对第二初始坐标值与第二距离进行加和处理，得到第二坐标值。

可选的，可视区域为矩形区域，目标坐标是可视区域的任一顶角在第一画布中的位置坐标，第一方向是水平方向，第二方向是垂直方向，目标尺寸包含可视区域在水平方向上的长度以及在垂直方向上的宽度；

其中，可视区域是基于任一顶角的位置坐标、水平方向上的长度以及垂直方向上的宽度，在第一画布上所确定的矩形区域。

可选的，第一画布按照树状结构被划分为M层子画布，M为正整数，第i层的任一子画布被划分为第i+1层的N个子画布，N个子画布均为任一子画布的下一子画布，M、i和N均为正整数，且i小于M；

第二获取模块基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素的方式，包括：

对树状结构中的M层子画布从上往下依次进行层层遍历；

基于遍历到的子画布、可视区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素。

可选的，第二获取模块基于遍历到的子画布、可视区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素的方式，包括：

对遍历到的子画布与可视区域进行相交计算；

若遍历到的第i层的任一子画布与可视区域不相交，则停止对任一子画布的下一子画布的遍历；

若遍历到的第i层的任一子画布与可视区域相交，则继续遍历任一子画布的下一子画布；

将在第M层子画布中遍历到的、且与可视区域相交的子画布，作为需绘制的子画布；

将图形元素集中元素位置处于需绘制的子画布内的图形元素，均确定为第一图形元素。

可选的，第一画布中的可视区域的位置支持动态变化；第二获取模块获取第一画布中的可视区域的方式，包括：

获取第一画布中的目标可视区域；目标可视区域是第一画布中当前的可视区域；

第二获取模块基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素的方式，包括：

若目标可视区域存在上一可视区域，则基于目标可视区域和上一可视区域，从图形元素集中筛选出第一图形元素；

其中，上一可视区域是第一画布中的可视区域变化为目标可视区域之前的可视区域。

可选的，第二获取模块基于目标可视区域和上一可视区域，从图形元素集中筛选出第一图形元素的方式，包括：

获取目标可视区域与上一可视区域之间的重叠区域，并将目标可视区域中除重叠区域之外的区域确定为更新区域；

基于更新区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素。

可选的，显示模块在第二画布中显示第二图形元素及目标原始数据的方式，包括：

在第二画布中，显示绘制得到的位于更新区域内的第二图形元素及目标原始数据；以及，

在第二画布中，显示在上一可视区域的重叠区域内已绘制的图形元素、以及已绘制的图形元素关联的原始数据。

可选的，上述数据处理装置还用于：

若接收到针对第二画布上显示的第三图形元素所触发的修改操作，则根据修改操作获取第一画布中的元素修改区域；

根据修改操作，在第一画布中对元素修改区域内的图形元素进行重新绘制；

在第二画布中，显示重新绘制的图形元素及重新绘制的图形元素关联的原始数据。

可选的，上述数据处理装置根据修改操作获取第一画布中的元素修改区域的方式，包括：

若修改操作不用于修改第三图形元素的元素位置，则将第三图形元素被触发修改操作时在第一画布中所在的元素区域，确定为元素修改区域；以及，

若修改操作用于修改第三图形元素的元素位置，则将第三图形元素被触发修改操作时在第一画布中所在的元素区域、以及第三图形元素在第一画布中待被修改至的元素区域，均确定为元素修改区域。

可选的，上述数据处理装置根据修改操作，在第一画布中对元素修改区域内的图形元素进行重新绘制的方式，包括：

若元素修改区域有多个，则对多个元素修改区域中相邻的元素修改区域进行合并处理，得到至少一个合并修改区域；

根据修改操作，在第一画布中对至少一个合并修改区域内的图形元素进行重新绘制。

本申请一方面提供了一种计算机设备，包括存储器和处理器，存储器存储有计算机程序，计算机程序被处理器执行时，使得处理器执行本申请中一方面中的方法。

本申请一方面提供了一种计算机可读存储介质，该计算机可读存储介质存储有计算机程序，该计算机程序被处理器执行时使该处理器执行上述一方面中的方法。

根据本申请的一个方面，提供了一种计算机程序产品，该计算机程序产品包括计算机程序，该计算机程序存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机程序，处理器执行该计算机程序，使得该计算机设备执行上述一方面等各种可选方式中提供的方法。

本申请获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。由此可见，本申请可以在第一画布上来进行图形元素的绘制，由于第一画布的尺寸是动态的，因此，不论需要绘制多少数量的图形元素，都能够在动态尺寸的第一画布上实现，使得本申请对需要绘制的图形元素的数量可以是无限制的；并且，第一画布还可以具有可视区域，本申请可以根据该可视区域来筛选当前需要绘制的图形元素，如可以只绘制与该可视区域相关联的图形元素（如第一图形元素），而无需一次性绘制图形元素集中的全部图形元素，因此，还可以提升对图形元素进行绘制的效率，从而可以提升对图形元素进行显示的及时性，综此，采用本申请提供的方法可以提升对图形元素进行绘制以及显示的性能。

附图说明

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

图1是本申请实施例提供的一种网络架构的结构示意图；

图2是本申请实施例提供的一种图表绘制的场景示意图；

图3是本申请实施例提供的一种数据处理方法的流程示意图；

图4a是本申请实施例提供的一种对第一画布进行划分的场景示意图；

图4b是本申请实施例提供的一种树状结构的结构示意图；

图5a是本申请实施例提供的一种元素复用的场景示意图；

图5b是本申请实施例提供的另一种元素复用的场景示意图；

图6是本申请实施例提供的一种获取图形元素在第二画布中的显示位置的场景示意图；

图7是本申请实施例提供的一种进行图形元素绘制的业务架构的架构示意图；

图8是本申请实施例提供的一种获取可视区域的方法的流程示意图；

图9是本申请实施例提供的一种显示图形元素的界面示意图；

图10是本申请实施例提供的一种动态变化可视区域的位置的场景示意图；

图11是本申请实施例提供的一种修改图形元素的方法的流程示意图；

图12是本申请实施例提供的一种数据处理装置的结构示意图；

图13是本申请实施例提供的一种计算机设备的结构示意图。

具体实施方式

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

本申请涉及到区块链的相关技术。其中，区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。区块链（Blockchain），本质上是一个去中心化的数据库，是一串使用密码学方法相关联产生的数据块，每一个数据块中包含了一批次网络交易的信息，用于验证其信息的有效性（防伪）和生成下一个区块。区块链可以包括区块链底层平台、平台产品服务层以及应用服务层。

区块链底层平台可以包括用户管理、基础服务、智能合约以及运营等处理模块。其中，用户管理模块负责所有区块链参与者的身份信息管理，包括维护公私钥生成（账户管理）、密钥管理以及用户真实身份和区块链地址对应关系维护（权限管理）等，并且在授权的情况下，监管和审计某些真实身份的交易情况，提供风险控制的规则配置（风控审计）；基础服务模块部署在所有区块链节点设备上，用来验证业务请求的有效性，并对有效请求完成共识后记录到存储上，对于一个新的业务请求，基础服务先对接口适配解析和鉴权处理（接口适配），然后通过共识算法将业务信息加密（共识管理），在加密之后完整一致的传输至共享账本上（网络通信），并进行记录存储；智能合约模块负责合约的注册发行以及合约触发和合约执行，开发人员可以通过某种编程语言定义合约逻辑，发布到区块链上（合约注册），根据合约条款的逻辑，调用密钥或者其它的事件触发执行，完成合约逻辑，同时还提供对合约升级注销的功能；运营模块主要负责产品发布过程中的部署、配置的修改、合约设置、云适配以及产品运行中的实时状态的可视化输出，例如：告警、监测网络情况、监测节点设备健康状态等。

平台产品服务层提供典型应用的基本能力和实现框架，开发人员可以基于这些基本能力，叠加业务的特性，完成业务逻辑的区块链实现。应用服务层提供基于区块链方案的应用服务给业务参与方进行使用。

本申请中，可以需要展示的原始数据集可以是存储在区块链网络中的，在需要采用图表对该原始数据集中的原始数据进行展示时，可以从区块链网络中获取到该原始数据集。通过在区块链网络中存储该原始数据集，可以保证该原始数据集中的原始数据不会被遭到篡改，从而可以保证所获取到的原始数据集的真实性和合法性。

首先，需要进行说明的是，本申请所采集的所有数据（如原始数据集、图表的配置数据等相关数据）都是在该数据所属对象（如用户、机构或者企业）同意并授权的情况下进行采集的，且相关数据的收集、使用和处理需要遵守相关地区的相关法律法规和标准。

此处，对本申请涉及到的相关技术概念进行说明：

维度：在数据分析领域，维度通常表示数据的某种特征，例如用户的信息、产品的类别等。这些特征有助于对数据进行分类和归纳。并且，维度可以有多个层次，例如地理位置可以分为省份、城市等层次，通过此种层次结构，可以在不同粒度上分析数据。

分面：在数据分析领域，分面是一种可视化技术，它允许在多个子图中展示数据的不同子集，以便更好地理解数据的结构和关系。分面通常用于探索多个分类变量之间的相互作用和影响，从而帮助人们发现数据中的潜在模式和趋势。分面技术允许我们在一个图表中展示多个维度的数据。

可视化渲染引擎：在web（网络）端，可视化渲染引擎是一种基于web技术的软件组件，它用于将数据和图形元素转换为可视化图形，以便在web浏览器中呈现和交互。这些引擎利用web平台提供的各种技术接口来创建丰富、动态和交互式的可视化图表，帮助用户更好地理解和分析数据。web端可视化渲染引擎通常会针对web平台进行性能优化，以确保在大量数据和复杂场景下依然能够保持流畅的交互体验。

canvas：是web端的一种图形绘制技术，它提供了一个基于JavaScript（一种编程语言）的绘图API（应用程序编程接口），允许开发者在web浏览器中绘制各种复杂的二维图形和动画。canvas具有良好的跨平台兼容性，可以在大多数现代浏览器中无需安装插件即可使用。开发者可以通过编写JavaScript代码来控制canvas上的绘图过程，实现动态和交互式的图形展示。

Echarts：ECharts是一款开源的web端图表库，是基于JavaScript编写的，提供了丰富的图表类型和功能，用于在web浏览器中创建交互式的数据可视化图表。ECharts具有良好的跨平台兼容性，可以在大多数现代浏览器中无需安装插件即可使用。

请参见图1，图1是本申请实施例提供的一种网络架构的结构示意图。如图1所示，网络架构可以包括服务器200和终端设备集群，终端设备集群可以包括一个或者多个终端设备，这里将不对终端设备的数量进行限制。如图1所示，多个终端设备具体可以包括终端设备1、终端设备2、终端设备3、…、终端设备n；如图1所示，终端设备1、终端设备2、终端设备3、…、终端设备n均可以与服务器200进行网络连接，以便于每个终端设备可以通过网络连接与服务器200之间进行数据交互。

如图1所示的服务器200可以是独立的物理服务器，也可以是多个物理服务器构成的服务器集群或者分布式系统，还可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、CDN（内容分发网络）、以及大数据和人工智能平台等基础云计算服务的云服务器。终端设备可以是：智能手机、平板电脑、笔记本电脑、桌上型电脑、智能电视、车载终端、便捷式终端、智能家电等智能终端。下面以终端设备1与服务器200之间的通信为例，进行本申请实施例的具体描述。

终端设备1可以是用于进行图表绘制的终端设备，绘制的图表可以用于展示原始数据，该原始数据可以是需要采用图表进行展示的任意数据，如该原始数据可以是商户各个月的销售额之类的数据，该原始数据可以是由服务器200提供给终端设备1的，或者，该原始数据也可以是终端设备1中的本地数据。可以理解的是，对图表进行绘制的过程就是对图表进行渲染的过程，即绘制同渲染。

请一并参见图2，图2是本申请实施例提供的一种图表绘制的场景示意图。如图2所示，本申请中可以有两个画布，一个画布是虚拟画布，该虚拟画布可以称为第一画布，该第一画布可以是用于终端设备1的系统进行图表绘制的画布；另一个画布是真实画布（即图中的真实canvas），该真实画布可以称为第二画布，该第二画布可以是实际用于在终端界面上显示在第一画布中绘制的图表的画布。

其中，图表可以包含若干图形元素，可以理解为，图表是由若干图形元素构成的，因此，绘制图表的过程就是绘制构成图表的图形元素的过程。

上述第一画布中可以具有可视区域，该可视区域的尺寸可以与第二画布的尺寸相同，本申请中只需实时绘制第一画布的可视区域内的图形元素（或者在一些场景中，可能还需要绘制可视区域外邻近的一些图形元素），且该第一画布的尺寸可以是支持无限延伸地动态变化的，因此不论总共需要绘制多少图形元素，均可以在第一画布上实现。并且，由于只需实时绘制第一画布的可视区域内或/可视区域邻近的图形元素，因此，不论总共需要绘制多少图形元素，也不会影响到针对图形元素的绘制性能。

进而，终端设备1可以将在第一画布上的可视区域内绘制的图形元素，实时显示在第二画布中，该第二画布就可以是用于显示第一画布的可视区域内绘制的图形元素的画布，该第二画布可以显示于终端设备1的终端界面上。可选的，该终端界面可以是web端的web界面。该具体过程也可以参见下述各实施例中的相关描述。

因此，采用本申请提供的方法，在不限制总共需要绘制的图形元素的数量的情况下，也能保证对图形元素进行实时绘制和显示的优越性能，使得能够适用于几乎所有的图表渲染显示场景。

请参见图3，图3是本申请实施例提供的一种数据处理方法的流程示意图。本申请实施例中的执行主体可以是数据处理设备，该数据处理设备可以是一个计算机设备或者是多个计算机设备构成的计算机设备集群，该计算机设备可以是终端设备，或者是其他设备，对此不做限制。如图3所示，该方法可以包括：

步骤S101，获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸。

可选的，数据处理设备可以获取到原始数据集和图形元素集，该原始数据集中可以包含需要采用图表进行展示的多个原始数据，该图形元素集中可以包含用于绘制对该原始数据集中的原始数据进行展示的图表的多个图形元素，可以理解为，图表是由若干图形元素构成的，通过对图形元素的绘制和显示可以实现对相应图表的绘制和显示。其中，图形元素集中的图形元素的数量也可以根据实际应用场景确定，对此不做限制。

在不同的应用场景中，原始数据集中的原始数据的类型也可以不同，原始数据集中的原始数据的类型根据实际的应用场景，可以是需要采用图表进行展示的任意类型的数据，如该图表可以是柱状图、折线图、饼图、点图、或者气泡图等任意类型的图表。本申请中用于展示原始数据的图表的类型可以根据实际应用场景确定，对此不做限制。

示例地，若需要采用图表来展示商家每个月的销售额，则原始数据集中的各个原始数据可以是每个月的销售额，一个原始数据可以是一个月的销售额。若需要采用图表来展示各个员工的工作量，则原始数据集中的各个原始数据可以是各个员工的工作量，一个原始数据可以是一个员工的工作量。等等。原始数据集中原始数据的数量也可以根据实际应用场景确定。

上述图形元素集可以是基于原始数据集进行解析得到的，该过程可以包括：

数据处理设备可以获取展示原始数据集中的原始数据所需图表的类型，可以将该类型称之为是目标类型。可选的，展示原始数据所需图表的类型可以是由相关用户在数据处理设备中进行选择的，该类型可以有一种或者多种，即目标类型可以有一种或者多种，换句话说，待绘制显示的图表可以有一种或者多种，待绘制显示的图表具体有多少种，可以根据实际应用场景确定。

数据处理设备还可以获取目标类型的图表的配置数据，若目标类型有多种，则一种目标类型可以具有对应的一个配置数据。其中，目标类型的图表的配置数据可以包含用于绘制该图表相关的图形元素的配置信息（该配置信息可以用于指示如何解析得到对应的图形元素），该图形元素可以是点、线、面、圆、环或矩形等用于绘制图表的元素。

以及，若目标类型有多种，则原始数据集中可以包含需采用各种目标类型的图表进行展示的原始数据，即每种目标类型的图表在原始数据集中均可以各自对应相应的原始数据，一种目标类型的图表对应的原始数据即为需要采用该种目标类型的图表进行展示的原始数据。

进而，数据处理设备可以基于原始数据集对上述目标类型的图表的配置数据进行解析处理，即可生成图形元素集。例如，若目标类型的图表是柱状图，原始数据集中包含需要采用柱状图进行展示的销售额，则一个销售额结合上柱状图的配置数据可以用于解析得到关联的一个柱子（如可以是矩形柱），该柱子即可以为柱状图中的一个图形元素，可选的，该柱子的宽度可以是柱状图的配置数据中默认的，而该柱子的高度可以是根据对应销售额（即解析得到该柱子的销售额）的数值所确定的，如该柱子的高度就可以用于表示（如等于）对应销售额的数值。

通过上述可以理解的是，在实际应用场景中，图形元素集中的一个图形元素可以是基于原始数据集中的一个或多个原始数据进行解析得到的。或者，可选的，原始数据集中还可以包含一些不是通过原始数据进行解析得到的图形元素，而是可以直接基于配置数据进行解析得到的图形元素，该图形元素可以称之为是附加图形元素，如该附加图形元素可以是用户选择的待绘制的图表中的坐标轴或者其他的一些用于对图表进行装饰或者说明的默认元素。

其中，若图形元素集中的一个图形元素是通过原始数据集中的一个或多个原始数据进行解析得到的，则可以认为该图形元素与该一个或多个原始数据之间具有关联关系，可选的，数据处理设备在解析得到图形元素集时也可以建立该关联关系。换句话说，一个图形元素可以与用于解析得到该图形元素的原始数据具有关联关系。

上述图形元素集中还可以包含解析得到的各个图形元素分别在第一画布中对应的元素位置，解析得到的一个图形元素在第一画布上可以具有解析得到的对应的一个元素位置，一个图形元素的元素位置可以是后续在第一画布中绘制该图形元素的位置，即可以理解为该图形元素的绘制位置。该第一画布可以是用于绘制图形元素（同绘制图表）的画布，该第一画布可以不是直接用于在前端界面（如终端界面）上通过绘制的图表展示原始数据的画布。

可选的，一个图形元素的元素位置可以是基于对应的矩形框所确定的，如一个图形元素的元素位置可以是通过一个元素坐标以及该图形元素的长度和宽度所确定的一个矩形框的位置范围，该元素坐标可以是该矩形框的左上角的顶角（或者也可以是其他的顶角，只要能确定对应图形元素在第一画布中所在的位置范围即可）在第一画布中的位置坐标。

第一画布可以具有坐标系，该坐标系可以包括第一方向上的坐标轴以及第二方向的坐标轴，可以将该第一方向上的坐标轴称之为是第一坐标轴，可以将该第二方向上的坐标轴称之为是第二坐标轴。该第一方向可以是水平方向，因此，第一坐标轴可以是x轴（横轴），该第二方向可以是垂直方向，因此，第二坐标轴可以是y轴（纵轴）。其中，上述元素坐标就可以是该坐标系中的坐标。

其中，可以将上述第一画布称之为是虚拟画布，该第一画布的尺寸可以被无限延伸（如第一画布的长和宽都可以被无限延伸），换句话说，该第一画布可以是尺寸无限大的画布，第一画布的尺寸可以是无限制的，该第一画布可以是存在于CPU（中央处理器）中的，数据处理设备可以在该第一画布中绘制图形元素集中的图形元素。因此，可以理解的是，该第一画布的尺寸可以是动态尺寸，即该第一画布的尺寸可以是根据实际应用场景进行动态变化的。

可选的，若图形元素集中包含待绘制的多个图表的图形元素，则数据处理设备可以根据该多个图表依次被选择的顺序（如用户依次选择该多个图表的顺序，即该多个图表即为在进行图表解析和绘制之前，用户所选择的用于展示原始数据的图表），在第一画布中依次排列解析得到该多个图表中的各个图表分别在第一画布中的位置，确定各个图表的位置之后，即可确定各个图表包含的图形元素在第一画布中的元素位置。可选的，一个图表中的各个图形元素在该图表中的位置可以是系统默认设定的，如可以是上述配置数据中配置好的，因此，在确定该图表在第一画布中的位置之后，即可基于该图表在第一画布中的位置、以及该图表中各个图形元素在该图表中的位置，推算出（也可以称为解析出）该图表中的各个图形元素在第一画布中的元素位置。

其中，解析得到的各个图表包含的各个图形元素的位置，就可以用于后续对图表包含的各个图形元素进行对应位置的绘制（即渲染）。

例如，若待绘制的图表包括5个图表，该5个图表包含依次被选择的图表t1、图表t2、图表t3、图表t4以及图表t5，则数据处理设备可以在第一画布上按照各个图表被选择的顺序依次解析各个图表的位置，即各个图表在第一画布中解析得到的对应的位置，可以是按照各个图表被选择的顺序依次规律地进行排布的。

例如，可以从第一画布的起始位置（如第一画布的左上角处的位置）开始，首先将图表t1解析在第一画布的左上角处的位置区域（可以是矩形区域），该位置区域也就是用于绘制该图表t1所需的位置，即图表t1在第一画布上所在的位置。

接着，数据处理设备可以继续在图表t1所在的位置区域下面，继续解析得到图表t2所在的位置区域，图表t2所在的位置区域可以是挨着图表t1所在的位置区域，即图表t2所在的位置区域可以是在图表t1所在的位置区域下相邻的位置区域。可选的，任两个挨着（如相邻）的图表之间可以具有默认的间隔距离（可以是上述配置数据中配置的），该间隔距离可以根据实际应用场景预先由系统设定，如图表t2所在的位置区域与图表t1所在的位置区域之间可以具有该间隔距离。

同理，数据处理设备可以接着在图表t2所在的位置区域下面，继续解析得到图表t3所在的位置区域，并在图表t3所在的位置区域下面，继续解析得到图表t4所在的位置区域，以及在图表t4所在的位置区域下面，解析得到图表t5所在的位置区域。图表t2与图表t3之间、图表t3与图表t4之间、以及图表t4与图表t5之间的距离，均可以是上述间隔距离。

或者，在另一种可行的实施方式中，还可以限制第一画布中一列最多所能排布的图表的数量，例如，若一列最多只能排布3个图表，则在第1列按照上述的原理依次排布解析了上述图表t1、图表t2以及图表t3之后，可以从第2列开始排布剩余的图表，如可以从第2列依次排布解析图表t4以及图表t5（图表t5可以排布在图表t4的下面）。

更多的，若待绘制的图表除上述5个图表之外，还包括接着选择的图表t6以及图表t7，则可以继续在上述第2行中的图表t5下面，继续解析得到图表t6所在的位置区域，至此，第2行中的图表也达到了3个，因此，可以继续在第一画布的第3行中继续解析得到图表t7所在的位置区域。若还有更多的图表需要解析，则均可以以此类推。

通过上述过程，即可解析得到图形元素集中各个图形元素各自在第一画布中对应的元素位置。

并且，第一画布的尺寸可以是被延伸至了能够容纳（如能够放置）基于图形元素集中的图形元素所需解析的全部图表的尺寸，可以将该尺寸称之为是目标尺寸。换句话说，本申请中的第一画布的尺寸可以根据所选择的待绘制的所有图表所需占用的全部区域的大小，进行自适应地延伸的，延伸到的该目标尺寸就可以是能够容纳（可以是刚好可以容纳，或者也可以比刚好能够容纳的尺寸更大一些，具体可以根据实际应用场景确定）待绘制的所有图表的尺寸。

步骤S102，获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素。

可选的，数据处理设备可以获取上述第一画布中的可视区域，该可视区域可以是第一画布中需要在前端界面（如终端界面）中进行显示的图形元素所在的区域。可选的，该可视区域可以是矩形区域。

其中，第一画布中的可视区域的位置是可以进行动态变化的，此处所获取的第一画布中的可视区域可以是第一画布中当前最新的可视区域，可以将第一画布中当前最新的可视区域称之为是目标可视区域，即此处获取的可视区域可以是该目标可视区域。需要理解的是，在可视区域的位置每在发生变化后的相关处理原理，与该目标可视区域的相关处理原理都是相同的，即目标可视区域可以是任一时刻的最新可视区域。其中，第一画布的可视区域具体如何变化，以及具体如何确定变化后的可视区域在第一画布中的位置，均可以参见下述图8对应实施例中的相关描述。

本申请中，在第一画布的可视区域内绘制的图形元素，可以在第二画布中进行显示，该第二画布可以是用于基于绘制的图表（同绘制的图形元素）展示原始数据的实际画布，第一画布的可视区域的尺寸可以与该第二画布的尺寸相同。该第二画布可以是用于在终端界面上实际显示绘制的图形元素的画布。换句话说，该第二画布可以是用于显示在第一画布的可视区域内绘制的图形元素的画布。

可选的，该第二画布的尺寸可以是固定尺寸，或者，该第二画布的尺寸可以是有限尺寸的，即该第二画布可以具有最大的固定尺寸。第一画布的可视区域的尺寸可以跟随该第二画布的尺寸，即第一画布的可视区域的尺寸可以与该第二画布的尺寸保持一致。

其中，第一画布的可视区域的尺寸通常可以小于第一画布的尺寸（如可视区域的尺寸可以小于上述目标尺寸），或者，在一些特殊情况下，第一画布的可视区域的尺寸也可以等于第一画布的尺寸（此种情况本申请不关注）。

可选的，在不同的终端设备的终端界面中的第二画布的尺寸可以相同，也可以不同，如第二画布的尺寸可以是所在终端设备进行内容显示时相适配的尺寸，即第二画布的尺寸可以基于终端设备本身的配置所确定。或者，第二画布的尺寸也可以由本系统的相关开发人员预先进行固定的设置。

本申请中，由于用于绘制图表的第一画布的尺寸可以被无限延伸，因此，不论待绘制的图表有多少或者该图表包含的图形元素有多少，均可以通过第一画布实现，即本申请对可以绘制的图表以及图形元素的数量是没有限制的，本申请支持对任意数量的图表以及图形元素进行绘制和显示。

并且，本申请在进行图形元素的绘制时，可以通过第一画布的可视区域来筛选出当前需要进行绘制的图形元素，可以将筛选出的当前需要绘制的图形元素称之为是第一图形元素，该第一图形元素可以有一个或多个，该第一图形元素的数量可以根据实际应用场景确定。

如上述第一图形元素可以是筛选出的元素位置位于可视区域内的图形元素、或/和元素位置与该可视区域相邻的图形元素，因此，本申请在实际进行图形元素的绘制时，无论图形元素集中的图形元素有多少，第一画布的尺寸被延伸到了多大（即目标尺寸不论有多大），本申请都只需要绘制筛选出来的第一图形元素，因此，采用本申请提供的方法，也不会影响到对图形元素集中的图形元素进行绘制的性能。

可选的，通过第一画布的可视区域以及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出当前需要绘制的第一图形元素的过程，可以包括：

第一画布可以按照树状结构被划分为M层子画布，M为正整数，M的具体取值可以根据实际应用场景确定。第i层的任一子画布可以被划分为第i+1层的N个子画布，该N个子画布均可以为该任一子画布的下一子画布，该N个子画布在该树状结构中均可以与该任一子画布具有连接关系，因此，可以理解的是，该任一子画布的各个下一子画布均属于该任一子画布内的局部画布。i和N均为正整数，且i可以小于M。其中，第一画布可以理解为是该M层子画布中第1层的特殊的子画布，第1层子画布可以只包含第一画布。

该第i+1层可以是该M层中除最后一层之外的任一层。N的取值也可以根据实际应用场景确定，如若上述树状结构采用四叉树，则N就可以等于4，即树状结构的一个节点（非叶子节点）下面可以连接有4个节点，树状结构中的任一个节点用于表示（或者理解为是记录）对应的一个子画布。实质上，在N等于4，即对每层的子画布进行4划分时，测试得到的效果是最好的，因为此种子画布的划分是对称且划分数量合适的。

因此，数据处理设备可以对树状结构中的上述M层子画布从上往下依次进行层层遍历，并可以通过遍历到的子画布、上述获取的可视区域（如目标可视区域）以及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出当前需绘制的上述第一图形元素，如下述内容描述。

数据处理设备可以对遍历到的子画布与上述获取的可视区域进行相交计算（每遍历到一个子画布时均可以将遍历到的该个子画布与可视区域进行相交计算），即判断遍历到的子画布是否与该可视区域之间存在相交（即是否存在重叠），若遍历到的上述第i层的任一子画布（即任一层的任一子画布）与该可视区域不相交，表明该任一子画布的位置与该可视区域的位置之间相隔较远，则可以停止对该任一子画布的下一子画布的遍历，并且，可以理解的是，停止对该任一子画布的下一子画布的遍历，当然也就不会再对该任一子画布的下一子画布之后依次连接的各个子画布进行遍历。

而若遍历到的上述第i层的任一子画布（即任一层的任一子画布）与该可视区域相交，表明该任一子画布的位置与该可视区域的位置之间相隔较近，则可以继续遍历该任一子画布的下一子画布，以此类推，直至遍历到第M层的子画布。

数据处理设备可以将在第M层子画布（即最后一层子画布）中遍历到的、且与可视区域相交的子画布，作为是需绘制的子画布，该需绘制的子画布可以有一个或多个，因此，数据处理设备可以将元素位置处于该需绘制的子画布内的图形元素，均作为是筛选出来的第一图形元素。此种方式筛选出来的第一图形元素就可以包括元素位置处于可视区域内的全部图形元素，以及可能还会包含元素位置在可视区域附近（可以理解为是相邻）的图形元素，因为需绘制的各个子画布合并起来的区域可能会略大于可视区域但肯定是包含可视区域的。

可见，本申请可以通过上述对M层子画布进行遍历，并判断遍历的子画布是否与目标可视区域相交，来筛选出目标可视区域关联的上述第一图形元素。

请参见图4a和图4b，图4a是本申请实施例提供的一种对第一画布进行划分的场景示意图，图4b是本申请实施例提供的一种树状结构的结构示意图。如图4a所示，上述N可以等于4，即可以对第一画布进行4等份的划分，且此处M可以等于3，即第一画布共被划分为3层子画布。

此处为了便于描述，引入了对第一画布进行划分时所划分得到的各个子画布的各个顶点（包括顶点d11~顶点d15、顶点d21~顶点d25、顶点d31~顶点d35、顶点d41~顶点d45、以及顶点d51~顶点d55）进行说明，但是，可以理解的是，在实际处理场景中，也可以不是通过被划分的各个子画布的顶点对被划分的各个子画布进行记录和标识的，而是通过其他形式进行记录和标识的，本申请对此不做限制。其中，顶点d33可以是第一画布的中心点。

如图4b所示，结合图4b可以更直观地对各层子画布进行说明，被划分的各个子画布均可以是矩形画布。特殊地，第1层子画布可以是第一画布本身。接着，第一画布可以被进行4等分，得到第2层子画布中的4个子画布，该4个子画布可以包括：由顶点d11、顶点d13、顶点d33、顶点d31、顶点d11依次进行连接所得到的闭合的矩形区域的子画布B1；由顶点d13、顶点d15、顶点d35、顶点d33、顶点d13依次进行连接所得到的闭合的矩形区域的子画布B2；由顶点d31、顶点d33、顶点d53、顶点d51、顶点d31依次进行连接所得到的闭合的矩形区域的子画布B3；以及，由顶点d33、顶点d35、顶点d55、顶点d53、顶点d33依次进行连接所得到的闭合的矩形区域的子画布B4。

再接着，可以对第2层子画布中的4个子画布也分别进行4等分，可以得到第2层子画布中的各个子画布在第3层子画布中对应的下一子画布。如子画布B1被划分得到的4个下一子画布可以包括：由顶点d11、顶点d12、顶点d22、顶点d21、顶点d11依次进行连接所得到的闭合的矩形区域的子画布B11；由顶点d12、顶点d13、顶点d23、顶点d22、顶点d12依次进行连接所得到的闭合的矩形区域的子画布B12；由顶点d21、顶点d22、顶点d32、顶点d31、顶点d21依次进行连接所得到的闭合的矩形区域的子画布B13；由顶点d22、顶点d23、顶点d33、顶点d32、顶点d22依次进行连接所得到的闭合的矩形区域的子画布B14。

同理，子画布B2被划分得到的4个下一子画布可以包括：由顶点d13、顶点d14、顶点d24、顶点d23、顶点d13依次进行连接所得到的闭合的矩形区域的子画布B21；由顶点d14、顶点d15、顶点d25、顶点d24、顶点d14依次进行连接所得到的闭合的矩形区域的子画布B22；由顶点d23、顶点d24、顶点d34、顶点d33、顶点d23依次进行连接所得到的闭合的矩形区域的子画布B23；由顶点d24、顶点d25、顶点d35、顶点d34、顶点d24依次进行连接所得到的闭合的矩形区域的子画布B24。

以及，子画布B3被划分得到的4个下一子画布可以包括：由顶点d31、顶点d32、顶点d42、顶点d41、顶点d31依次进行连接所得到的闭合的矩形区域的子画布B31；由顶点d32、顶点d33、顶点d43、顶点d42、顶点d32依次进行连接所得到的闭合的矩形区域的子画布B32；由顶点d41、顶点d42、顶点d52、顶点d51、顶点d41依次进行连接所得到的闭合的矩形区域的子画布B33；由顶点d42、顶点d43、顶点d53、顶点d52、顶点d42依次进行连接所得到的闭合的矩形区域的子画布B34。

并且，子画布B4被划分得到的4个下一子画布可以包括：由顶点d33、顶点d34、顶点d44、顶点d43、顶点d33依次进行连接所得到的闭合的矩形区域的子画布B41；由顶点d34、顶点d35、顶点d45、顶点d44、顶点d34依次进行连接所得到的闭合的矩形区域的子画布B42；由顶点d43、顶点d44、顶点d54、顶点d53、顶点d43依次进行连接所得到的闭合的矩形区域的子画布B43；由顶点d44、顶点d45、顶点d55、顶点d54、顶点d44依次进行连接所得到的闭合的矩形区域的子画布B44。

因此，本申请可以对上述3层子画布进行层层遍历，首先，遍历第1层子画布中的第一画布，由于遍历到的第一画布与图4a中的可视区域相交，因此，接着遍历第一画布在第2层子画布中的各个下一子画布，即可以依次遍历子画布B1~子画布B4。由于子画布B1以及子画布B3均与可视区域不相交，因此，无需接着遍历子画布B1以及子画布B3在第3层子画布中的各个下一子画布，以此可以大大减少进行子画布遍历的工作量；以及，由于子画布B2和子画布B4均与可视区域相交，因此，可以继续在第3层子画布中遍历子画布B2的各个下一子画布以及子画布B4的各个下一子画布，即遍历子画布B21~子画布B24，并遍历子画布B41~子画布B44。

由于第3层子画布是最后一层子画布，因此，可以将在第3层子画布中遍历到的子画布B21~子画布B24以及子画布B41~子画布B44中，与可视区域相交的子画布B23、子画布B24、子画布B41以及子画布B42，作为是需绘制的子画布，从而可以将该元素位置处于该子画布B23、子画布B24、子画布B41以及子画布B42内的图形元素，作为是筛选出来的上述第一图形元素。

通过上述对划分的各个子画布进行遍历和筛选，而不用直接对全部的各个图形元素进行遍历，可以提升对可视区域内的图形元素进行筛选的效率。

或者，可选的，若获取的可视区域（如目标可视区域）不存在上一可视区域，即目标可视区域是最开始（如第1次）在第一画布中获取的可视区域，即目标可视区域是最开始一次都未发生变化时的可视区域（可以称为初始可视区域，该初始可视区域可以是第一画布中最左上部分的区域，如该初始可视区域的左上角可以与第一画布的左上角是重合的），则本申请可以采用上述的流程，通过对M层子画布进行遍历，并判断遍历的子画布是否与目标可视区域相交，来筛选出上述第一图形元素。

而若获取的可视区域（如目标可视区域）存在上一可视区域，即目标可视区域不是最开始（如第1次）在第一画布中获取的可视区域（即目标可视区域不是上述初始可视区域），也即目标可视区域是在第1次获取到的可视区域的基础上进行变化（变化次数不限）后得到的可视区域，则本申请在筛选目标可视区域关联的图形元素时（如通过目标可视区域筛选第一图形元素时），还可以复用在此之前在目标可视区域的上一可视区域内已经绘制得到的图形元素，以此可以进一步提升对图形元素进行绘制的效率，并提升对图形元素进行显示的及时性。其中，目标可视区域的上一可视区域可以是第一画布中的可视区域变化为该目标可视区域之前的可视区域，更具体的，目标可视区域的上一可视区域可以是第一画布中的可视区域变化为该目标可视区域之前最新的可视区域，即目标可视区域可以是该上一可视区域再进行一次变化后得到的。

此种情况下（即目标可视区域存在上一可视区域的情况下），通过目标可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素的过程，可以包括：数据处理设备可以通过目标可视区域和目标可视区域的上一可视区域，从图形元素集中筛选出当前需要绘制的第一图形元素，如下述内容描述。

数据处理设备可以获取目标可视区域与该上一可视区域之间的重叠区域，即目标可视区域和该上一可视区域均包含该重叠区域，并可以将目标可视区域中除该重叠区域之外的区域作为是更新区域，该更新区域也就是目标可视区域相较于该上一可视区域的增量区域。

进而，数据处理设备可以通过第一画布中的该更新区域以及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素，可选的，该过程可以与上述通过对M层子画布进行遍历，并判断遍历的子画布是否与目标可视区域相交，来筛选出上述第一图形元素的原理相同，此处，可以通过对M层子画布进行层层遍历，并判断遍历的子画布是否与该更新区域相交，来筛选出第一图形元素，此种方式筛选出的第一图形元素就可以包括元素位置位于在第M层子画布中遍历到的、且与该更新区域相交的子画布内的图形元素。

请参见图5a和图5b，图5a是本申请实施例提供的一种元素复用的场景示意图，图5b是本申请实施例提供的另一种元素复用的场景示意图。如图5a所示，旧视口可以是上述目标可视区域的上一可视区域，新视口可以是目标可视区域，该目标可视区域与该上一可视区域之间具有重叠区域，该重叠区域就可以是图5a中的像素复用区域，新视口中除该像素复用区域之外的区域（即增量绘图区域），就可以是上述更新区域。

此处需要进行说明的是，对图形元素进行绘制可以包括生成构成该图形元素的各个像素点（可以简称像素），各个像素点均可以具有各自的像素值和像素位置，该像素位置可以是对应像素点需要绘制在第一画布中的位置，即该像素位置可以是对应像素点在第一画布中所在的位置。

因此，本申请可以在像素复用区域内复用在该上一可视区域中已经绘制的处于该像素复用区域内的各个像素点。

其中，本申请的像素复用过程中可以有两种概念，一种是主canvas（可以称为主画布），一种是离屏canvas（可以称为离屏画布）。该主canvas可以用于绘制图形元素，以向用户进行实际的展示，该主canvas可以是挂载在html（一种标记语言）文档上的；而该离屏canvas可以不是挂载在文档上的，该离屏canvas可以是一个专门用于存储像素信息（如在可视区域内绘制的用于构成图形元素的各个像素点的信息，该信息可以包含像素点的像素值和像素位置）的元素，不用于在屏幕（如终端界面）上进行实际的展示。

如图5b所示，本申请可以将离屏canvas中在该上一可视区域的上述像素复用区域内生成的各个像素点，复用到主canvas中目标可视区域的该像素复用区域内，并可以实时绘制主canvas中目标可视区域的增量绘图区域内的图形元素，即可实现对目标可视区域内的图形元素的绘制和显示。

通过上述过程，即可筛选出当前需要绘制的第一图形元素，筛选出的第一图形元素可以是元素位置位于第M层子画布中与目标可视区域相交的子画布内的图形元素（即目标可视区域关联的图形元素），或者筛选出的第一图形元素可以是元素位置位于第M层子画布中与上述更新区域相交的子画布内的图形元素（即更新区域关联的图形元素）。

本申请通过采用树状结构来进行子画布的遍历，可以快速地从图形元素集中大量的图形元素中筛选出目标可视区域或者更新区域关联的图形元素，即快速筛选出当前需要绘制的第一图形元素。

可选的，若图形元素集中图形元素的数量不那么庞大（如少于预设的参考数量），且需要获取目标可视区域关联的图形元素，则也可以直接对图形元素集中的各个图形元素进行遍历，并对遍历到图形元素与目标可视区域进行相交计算，并可以将与目标可视区域相交的图形元素，作为是筛选出的第一图形元素，此种情况下，筛选出来的第一图形元素就可以只包含目标可视区域内的全部图形元素，而不包含目标可视区域外的图形元素。

同理，若图形元素集中图形元素的数量不那么庞大（如少于预设的参考数量），且需要获取更新区域关联的图形元素，则也可以直接对图形元素集中的各个图形元素进行遍历，并对遍历到图形元素与更新区域进行相交计算，并可以将与更新区域相交的图形元素，作为是筛选出的第一图形元素，此种情况下，筛选出来的第一图形元素就可以只包含更新区域内的全部图形元素。

步骤S103，在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据。

可选的，数据处理设备可以在第一画布中对应元素位置（即第一图形元素的元素位置）处绘制上述筛选出来的第一图形元素。其中，可以将绘制得到的位于可视区域内的第一图形元素，称之为是第二图形元素。可选的，该第二图形元素可以是部分的第一图形元素，或者，该第二图形元素也可以是全部的第一图形元素。

可选的，若上述第一图形元素是筛选的目标可视区域关联的图形元素（如第M层子画布中与目标可视区域相交的子画布内的图形元素），则第二图形元素可以包括在整个目标可视区域内绘制的图形元素。

若上述第一图形元素是筛选的更新区域关联的图形元素（如第M层子画布中与更新区域相交的子画布内的图形元素），则第二图形元素可以包括在整个更新区域内绘制的图形元素。

数据处理设备还可以根据上述第二图形元素，从原始数据集中筛选出当前需要展示的原始数据，可以将该筛选出的当前需要展示的原始数据称之为是目标原始数据，该目标原始数据可以有一个或多个，该目标原始数据的具体数量可以根据实际应用场景确定。

其中，根据绘制得到的第二图形元素，从原始数据集中筛选出需展示的上述目标原始数据的过程，可以包括：数据处理设备可以从原始数据集中，筛选出与该第二图形元素具有关联关系的原始数据，作为筛选出的目标原始数据，即目标原始数据可以包括用于解析得到第二图形元素的原始数据。

步骤S104，在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。

可选的，数据处理设备可以在第二画布中显示第二图形元素以及目标原始数据，目标原始数据可以与所绘制的具有关联关系的图形元素进行关联显示。例如，若一个目标原始数据是一个销售额，所绘制的与该目标原始数据具有关联关系的图形元素是一个柱子，则在第二画布中可以在该柱子的上方显示该销售额。

其中，若上述第一图形元素是筛选的目标可视区域关联的图形元素（如第M层子画布中与目标可视区域相交的子画布内的图形元素），则整个第二画布中就可以全部用于显示第二图形元素以及目标原始数据。

若上述第一图形元素是筛选的更新区域关联的图形元素（如第M层子画布中与更新区域相交的子画布内的图形元素），则数据处理设备可以在第二画布中，显示绘制得到的位于更新区域内的第二图形元素以及目标原始数据，并可以在第二画布中，显示在此之前在目标可视区域的上一可视区域中的上述重叠区域（即目标可视区域与目标可视区域的上一可视区域之间的重叠区域）内已经绘制得到的图形元素（可以称为已绘制的图形元素）、以及该已绘制的图形元素关联的原始数据，该已绘制的图形元素关联的原始数据即为与该已绘制的图形元素具有关联关系的原始数据。

换句话说，在从该上一可视区域变化为目标可视区域时，目标可视区域与该上一可视区域之间的重叠区域内的图形元素无需再重新重复绘制，而是可以直接复用在该上一可视区域的该重叠区域内已经绘制得到的图形元素，以此可以减少对图形元素进行绘制的开销，提升对图形元素进行绘制显示的效率。

可选的，在另一种可行的实施方式中，通过原始数据解析得到的对应的图形元素也可以包含该原始数据，或者可以用于指示该原始数据，因此，此种情况下，在第二画布中也可以直接显示绘制得到的图形元素，而无需额外显示与绘制得到的该图形元素具有关联关系的原始数据，具体可以根据实际应用场景进行灵活配置，对此不做限制。

请参见图6，图6是本申请实施例提供的一种获取图形元素在第二画布中的显示位置的场景示意图。如图6所示，第一画布和第二画布可以是处于不同的坐标系下的。可选的，第一画布的坐标系的原点可以是在第一画布的左下角（即左下顶角）的位置，第二画布的坐标系的原点也可以是在第二画布的左下角（即左下顶角）的位置。

因此，若第一画布的可视区域内包含图形元素Q，图形元素Q在第一画布的坐标系中的位置坐标可以是（x1，y1），x1和y1的具体数值可以根据实际应用场景确定。该位置坐标（x1，y1）可以是图形元素Q在第一画布中所在矩形区域的左上角（即左上顶角）的位置坐标。

此处，第一画布中的可视区域的左上角（即左上顶角）距离第一画布的上边缘（即上边线）的距离可以为dy，第一画布中的可视区域的左上角（即左上顶角）距离第一画布的左边缘（即左边线）的距离可以为dx。

因此，图形元素Q在第二画布中对应的显示位置就可以是位置坐标（x1-dx，y1-dy）指示的位置，该位置坐标（x1-dx，y1-dy）可以是图形元素Q在第二画布中所在矩形区域的左上角（即左上顶角）的位置坐标。即图形元素Q在第二画布中所在矩形区域的左上角的横坐标可以是x1减去dx所得到的差值，图形元素Q在第二画布中所在矩形区域的左上角的纵坐标可以是y1减去dy所得到的差值。

可以理解的是，在第一画布的可视区域内绘制的各个图形元素都可以按照上述的原理在第二画布中对应的位置处进行显示。

请参见图7，图7是本申请实施例提供的一种进行图形元素绘制的业务架构的架构示意图。如图7所示，本申请的业务架构可以包括业务层、Echarts层和渲染引擎。该业务层可以提供图表的配置项，该配置项可以是图表的配置数据中针对所属图表的各个配置项。

其中，该Echarts层可以基于Echarts图表库工具获取（如解析得到）构成图表且渲染引擎可识别的各个图形元素（可以包括上述图形元素集中的各个图形元素），该图形元素可以包括Rect（矩形）、Circle（圆）、Text（文本）、Line（线）等图形元素。

并且，可以将Echarts内原本应用的渲染引擎替换为本申请提供的新的渲染引擎，本申请新的渲染引擎即可以用于在虚拟画布（即第一画布）上进行图形元素的绘制，且进行图形元素的绘制时可以只用于实时绘制该虚拟画布的可视区域内或/和该可视区域相邻的图形元素，以及可以将在虚拟画布中绘制的图形元素再实时显示至实际画布（即第二画布）中。

因此，可以理解的是，该新的渲染引擎就可以获取到所有元素列表，该所有元素列表可以是上述图形元素集，该所有元素列表就可以包含待绘制的所有图表的图形元素。本申请的该新的渲染引擎还可以从该所有元素列表中筛选出视口内元素列表，该视口内元素列表可以包括基于第一画布的可视区域筛选出的上述需绘制的第一图形元素，进而，该新的渲染引擎即可按照上述所描述的方法对该视口内元素列表中的图形元素进行渲染（即绘制）。

综上描述，本申请在不限制总共可以进行绘制的图表以及图形元素的数量的情况下，通过只绘制可视区域内或/和可视区域相邻的图形元素，也使得不会影响到进行图形元素绘制的整体性能，因此，采用本申请的方法可以保证对图表进行绘制和显示的优越性能。

并且，已有方案中，在浏览器的web端要实现大数据、多维度、多分面的可视化分析时，需要一次性绘制大量的图表，而这些图表的数量成千上万，因此需要一次性生成大量的图形元素，导致浏览器会严重卡顿，甚至崩溃，并且，浏览器的画布对总共需要渲染的图形元素的像素大小也具有限制，因此，在图表较多的情况下，还会导致浏览器无法进行绘制，而采用本申请的上述方法提供了一种可视化渲染引擎，通过该可视化渲染引擎可以同时解决这两个问题，本申请的该可视化渲染引擎可以快速地将成千上万的图表绘制出来且不受浏览器像素大小的限制，也不会发生卡顿的情况。

本申请获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。由此可见，本申请可以在第一画布上来进行图形元素的绘制，由于第一画布的尺寸是动态的，因此，不论需要绘制多少数量的图形元素，都能够在动态尺寸的第一画布上实现，使得本申请对需要绘制的图形元素的数量可以是无限制的；并且，第一画布还可以具有可视区域，本申请可以根据该可视区域来筛选当前需要绘制的图形元素，如可以只绘制与该可视区域相关联的图形元素（如第一图形元素），而无需一次性绘制图形元素集中的全部图形元素，因此，还可以提升对图形元素进行绘制的效率，从而可以提升对图形元素进行显示的及时性，综此，采用本申请提供的方法可以提升对图形元素进行绘制以及显示的性能。

请参见图8，图8是本申请实施例提供的一种获取可视区域的方法的流程示意图。如图8所示，该方法可以包括：

步骤S201，获取第一滚动条所滚动的第一距离及第二滚动条所滚动的第二距离。

可选的，上述第二画布可以是显示在终端界面上的，该终端界面中还可以包含（如显示有）第一滚动条和第二滚动条，该第一滚动条可以用于在第一方向（如水平方向）上对第一画布的可视区域进行滚动变化（可以理解为是在第一坐标轴（如横轴）上对可视区域的位置进行滚动变化），该第二滚动条可以用于在第二方向上（如垂直方向）上对第一画布的可视区域进行滚动变化（可以理解为是在第二坐标轴（如纵轴）上对可视区域的位置进行滚动变化）。

其中，第一画布被延伸至的上述目标尺寸可以包括第一画布在第一方向上被延伸至的尺寸、以及第一画布在第二方向上被延伸至的尺寸，第一画布在第一方向上被延伸至的尺寸可以是第一画布被延伸至的长度，第一画布在第二方向上被延伸至的尺寸可以是第一画布被延伸至的宽度。

第一滚动条用于滚动的总距离（可以理解为是第一滚动条的总长度）可以等于第一画布在第一方向上被延伸至的尺寸，即第一画布的长度；第二滚动条用于滚动的总距离（可以理解为是第二滚动条的总长度）可以等于第一画布在第二方向上被延伸至的尺寸，即第一画布的宽度。

由此，通过第一滚动条可以在第一方向上滚动显示第一画布中各个元素位置处的图形元素，通过第二滚动条可以在第二方向上滚动显示第一画布中各个元素位置处的图形元素，通过结合该第一滚动条和第二滚动条就可以实现对第一画布中全部元素位置处的图形元素的滚动显示。

由上，可以理解的是，支持用户在终端界面中滚动该第一滚动条和第二滚动条（两个滚动条可以分别独立地进行滚动），以显示在第一画布的不同位置处所绘制的不同的图形元素。实际上，用户无需感知到第一画布的存在，在用户的感知上，用户感受到的可以就是通过第一滚动条和第二滚动条，可以显示不同位置的图表。

因此，数据处理设备可以获取到第一滚动条当前被滚动的距离（可以称为第一距离），并可以获取到第二滚动条当前被滚动的距离（可以称为第二距离）。

请参见图9，图9是本申请实施例提供的一种显示图形元素的界面示意图。如图9所示，本申请的第二画布可以显示在终端界面上，该第二画布中可以显示在第一画布的可视区域内绘制的图形元素。该终端界面上还可以包含第一滚动条和第二滚动条，该第一滚动条上可以具有滑块，支持在第一滚动条上对该滑块进行滚动，以从水平方向上滚动变化第一画布中的可视区域的位置。同理，该第二滚动条上也可以具有滑块，支持在第二滚动条上对该滑块进行滚动，以从垂直方向上滚动变化第一画布中的可视区域的位置。

步骤S202，基于第一距离和第二距离，在第一画布中确定可视区域。

可选的，数据处理设备可以通过该第一距离获取到第一坐标值，该第一坐标值可以用于在第一坐标轴上指示当前的可视区域在第一画布中的位置，即该第一坐标值可以是坐标系中的一个横坐标。

以及，数据处理设备还可以通过该第二距离获取到第二坐标值，该第二坐标值可以用于在第二坐标轴上指示当前的可视区域在第一画布中的位置，即该第二坐标值可以是坐标系中的一个纵坐标。

具体的，数据处理设备可以获取第一画布的可视区域在第一方向上的初始坐标值（可以称为第一初始坐标值），该第一初始坐标值可以是用于指示第一画布最开始未经过变化时的可视区域在第一坐标轴上的位置的横坐标。例如，该第一初始坐标值可以是第一画布最开始未经过变化时的可视区域的左上角（即左上顶角）的横坐标。

进而，数据处理设备可以对该第一初始坐标值与第一距离进行加和处理（即相加计算），即可得到上述第一坐标值，对应的，该第一坐标值可以是当前的可视区域（如目标可视区域）的左上角的横坐标。

同理，数据处理设备还可以获取第一画布的可视区域在第二方向上的初始坐标值（可以称为第二初始坐标值），该第二初始坐标值可以是用于指示第一画布最开始未经过变化时的可视区域在第二坐标轴上的位置的纵坐标。例如，该第二初始坐标值可以是第一画布最开始未经过变化时的可视区域的左上角（即左上顶角）的纵坐标。

进而，数据处理设备可以对该第二初始坐标值与第二距离进行加和处理（即相加计算），即可得到上述第二坐标值，对应的，该第二坐标值可以是当前的可视区域（如目标可视区域）的左上角的纵坐标。

进而，数据处理设备通过上述得到的第一坐标值和第二坐标值，就可以构建得到第一画布所在坐标系中的目标坐标，该目标坐标中的横坐标就可以是该第一坐标值，该目标坐标中的纵坐标就可以是该第二坐标值，该目标坐标可以是当前的可视区域的左上角（如可视区域这个矩形区域的左上角的顶角）在该坐标系中的位置坐标。

因此，第一画布当前的可视区域（如目标可视区域）在第一画布中的区域位置，就可以是由该目标坐标以及可视区域的尺寸（可以包括可视区域的长和宽）进行结合后唯一确定的。可选的，本申请中的可视区域在第一画布中的位置支持动态变化，但在可视区域的位置进行动态变化的过程中，可视区域的尺寸可以不进行变化。

可选的，在实际应用场景中，上述目标坐标也可以是用于在第一画布中定位可视区域的任一坐标，如目标坐标也可以是当前的可视区域的任一顶角在第一画布中的位置坐标，因此，通过用于对第一画布的可视区域进行定位的一个坐标（即目标坐标）结合上该可视区域在水平方向上的长度、以及该可视区域在垂直方向上的宽度，即可唯一确定第一画布中当前的可视区域所在的矩形区域。

在另一种可行的实施方式中，用于对第一画布的可视区域的位置进行滚动变化的滚动条也可以只有一个，如可以只有垂直方向上的滚动条，那么，此种情况下，可视区域在水平方向上的尺寸可以等于第一画布在水平方向上被延伸至的尺寸，且此种情况下，可视区域在第一画布中的水平方向上的位置就无需滚动变化，而只需对可视区域在垂直方向上的位置进行滚动变化。

反之亦然，也可以只有水平方向上的滚动条，那么，此种情况下，可视区域在垂直方向上的尺寸可以等于第一画布在垂直方向上被延伸至的尺寸，且此种情况下，可视区域在第一画布中的垂直方向上的位置就无需滚动变化，而只需对可视区域在水平方向上的位置进行滚动变化。

或者，上述滚动条只是用于对第一画布中的可视区域的位置进行滚动变化的一种形式，在更多的实现方式中，还可以通过其他的形式对第一画布中的可视区域的位置进行动态变化，不一定必须要通过滚动条对第一画布中的可视区域的位置进行动态变化，本申请对此不做限制。

请参见图10，图10是本申请实施例提供的一种动态变化可视区域的位置的场景示意图。如图10所示，第一画布中的可视区域的初始位置可以是在第一画布的左上区域位置处（如该初始位置处的可视区域的左上角的位置可以是在第一画布的左上角的位置Z1），通过用户在终端界面上对可视区域进行动态变化（如通过滚动条进行滚动变化）的操作，可以将第一画布中的可视区域动态变化至第一画布中的其他位置，如可视区域的左上角的位置可以变化至第一画布中的位置Z2处。

可见，本申请在只绘制第一画布的可视区域内或/和相邻的图形元素的情况下，也支持用户在终端界面上对当前的可视区域进行动态切换，以显示第一画布中更多其他元素位置处的图形元素，使得用户可以查看到第一画布上所有的元素位置处的图形元素，当然，用户可以无需感知到第一画布的存在。

请参见图11，图11是本申请实施例提供的一种修改图形元素的方法的流程示意图。如图11所示，该方法可以包括：

步骤S301，若接收到对第二画布上显示的第三图形元素所触发的修改操作，则根据修改操作获取第一画布中的元素修改区域。

可选的，第三图形元素可以是在第二画布上显示的任意图形元素，第三图形元素可以是一个或多个，用户可以在第二画布中对显示的第三图形元素执行修改操作，以修改该第三图形元素。如用户对整个图表的位置进行拖动时，修改的第三图形元素就可以包括拖动的该图表所包含的各个图形元素；或者也可以只对单个第三图形元素进行修改。

其中，对第三图形元素触发的修改操作可以是用于对第三图形元素的位置、显示样式、尺寸、或者所包含的数据进行修改，等等；具体是哪种修改，可以根据实际应用场景确定。

可选的，一个图形元素在第一画布中所在的位置区域也可以是一个矩形区域，该矩形区域可以是该图形元素在第一画布中所在的最小区域，即可以是刚好容纳该图形元素的矩形区域。因此，可以理解的是，一个图形元素在第一画布中所在的元素位置就可以用于指示该图形元素在第一画布中所在的位置区域（即所在的矩形区域）。

因此，若数据处理设备接收到对第二画布上显示的第三图形元素所触发的修改操作，则可以先根据该修改操作获取第一画布中的元素修改区域，该元素修改区域也就是被修改的区域，该元素修改区域可以称之为是脏区域，该脏区域也可以是矩形区域，因此，也可以将该脏区域称之为是脏矩形。可选的，该元素修改区域可以有一个或多个，该一个或多个元素修改区域可以构成脏矩形列表。

其中，根据对第三图形元素的修改操作获取第一画布中的元素修改区域的过程，可以包括：若该修改操作不用于修改第三图形元素的元素位置（即第三图形元素所在的位置区域），则可以将第三图形元素被触发该修改操作时在第一画布中所在的元素区域，作为是上述元素修改区域。

而若该修改操作用于修改第三图形元素的元素位置，则可以将第三图形元素被触发该修改操作时在第一画布中所在的元素区域（即第三图形元素被修改前所在的元素区域）、以及第三图形元素在第一画布中待被修改至的元素区域（即第三图形元素需要被修改至的元素区域），均作为是元素修改区域，因为第三图形元素被修改前所在的元素区域和需要修改至的元素区域，都需要被对应修改。

可见，一个第三图形元素可以对应一个或两个元素修改区域，若第三图形元素有多个，则多个第三图形元素可以对应多个元素修改区域。

步骤S302，根据修改操作，在第一画布中对元素修改区域内的图形元素进行重新绘制。

可选的，数据处理设备遍历各个元素修改区域（如遍历脏矩形列表中的各个脏矩形），并可以根据上述修改操作，在第一画布中对各个元素修改区域内的图形元素进行重新绘制，可以理解为是对元素修改区域进行重新绘制。其中，可以理解的是，该修改操作需要对第三图形元素进行何种修改，就可以在元素修改区域内进行相对应的绘制，以得到在元素修改区域内重新绘制的图形元素。

例如，重新绘制的第三图形元素可以是按照该修改操作修改后的第三图形元素；再如，若是需要将第三图形元素从原本所在的元素位置移动至另一个元素位置，则原本所在的元素位置处的元素区域内的第三图形元素可以被清空。

可选的，在另一种可行的实施方式中，若上述元素修改区域有多个，则数据处理设备还可以对该多个元素修改区域中相邻的元素修改区域进行合并处理，可以得到至少一个合并修改区域，进而，对得到的各个合并修改区域进行重新绘制。可选的，相邻的元素修改区域可以是指距离小于或等于设定的距离阈值的元素修改区域，若相邻的元素修改区域有多个，则该多个相邻的元素修改区域均可以合并在一起，得到对应的一个合并修改区域。

其中，合并修改区域也可以是矩形区域，合并修改区域是可以同时容纳所合并的各个元素修改区域的最小矩形区域。例如，若元素修改区域q1与元素修改区域q2相邻，元素修改区域q2与元素修改区域q3相邻，则可以将元素修改区域q1、元素修改区域q2以及元素修改区域q3均合并在一起，得到可以同时容纳该元素修改区域q1、元素修改区域q2以及元素修改区域q3的一个合并修改区域。

再如，若元素修改区域q4和元素修改区域q5相邻，则可以将元素修改区域q4和元素修改区域q5进行合并处理，得到可以同时容纳该元素修改区域q4和元素修改区域q5的最小矩形区域，即得到对应的一个合并修改区域。

再如，若元素修改区域q6与其他各个元素修改区域均不相邻，则元素修改区域q6可以作为自己的一个特殊的合并修改区域，即此种情况下，该合并修改区域就可以是元素修改区域q6在第一画布中所在的元素区域。

通过上述过程，即可以得到至少一个合并修改区域，一个合并修改区域可以是对至少两个元素修改区域进行合并处理得到的，或者一个合并修改区域也可以是不与其他各个元素修改区域相邻的元素修改区域本身。

进而，数据处理设备就可以根据上述修改操作，在第一画布中对上述得到的各个合并修改区域内的图形元素进行重新绘制，也就是对各个合并修改区域进行重新绘制，以得到在各个合并修改区域中重新绘制的图形元素。

需要进行说的是，对元素修改区域进行合并时可能会引入元素修改区域之外的其他区域，使得引入的该其他区域内的图形元素也需要被重新绘制，因此，在实际对元素修改区域进行合并处理时，可以对合并处理的操作进行相关的限制，以保证图形元素绘制的性能，例如，可以将上述距离阈值设置得小一些，再如，可以限制合并在一起的元素修改区域的最大数量，如一个合并修改区域最多只能由3个元素修改区域合并得到，等等。

上述过程中，通过将多个元素修改区域合并为数量更少的合并修改区域，使得数据处理设备可以处理（如识别和分别绘制等处理）更少数量的修改区域（如合并修改区域），以此也可以提升数据处理设备对修改区域内的图形元素进行重新绘制的性能。

步骤S303，在第二画布中，显示重新绘制的图形元素及重新绘制的图形元素关联的原始数据。

可选的，数据处理设备也可以在第二画布中的对应位置处，显示重新绘制的图形元素以及该重新绘制的图形元素关联的原始数据（即与该重新绘制的图形元素具有关联关系的原始数据），以实现用户对第三图形元素的相应修改，并让用户查看到此种修改。

可以理解的是，第一画布的可视区域内绘制的图形元素如何进行排布，那么该可视区域内绘制的图形元素在第二画布上也是对应位置地进行显示。

通过上述过程，通过脏矩形的方式，本申请只需重新绘制发生变化（即发生修改）的图形元素，而无需重新绘制整个可视区域内的所有图形元素，这也可以提升在修改图形元素时对图形元素进行绘制和显示的效率以及性能。

采用本申请提供的上述方法，可以在面对大数据、多维度、多分面的可视化场景时，能够在极短的时间内将大量的图表绘制出来，且不会有卡顿的现象，同时突破了浏览器的canvas在像素绘制方面的极限，从而在图表绘制和显示的场景中可以表现出优越的性能，也使得用户在通过图表进行数据分析时，能够更加游刃有余。

请参见图12，图12是本申请实施例提供的一种数据处理装置的结构示意图。如图12所示，该数据处理装置120可以包括：第一获取模块1201、第二获取模块1202、绘制模块1203和显示模块1204。

第一获取模块1201，用于获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；

第二获取模块1202，用于获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；

绘制模块1203，用于在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；

显示模块1204，用于在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。

可选的，第一画布的尺寸被延伸至目标尺寸，目标尺寸是能够容纳基于图形元素集所需绘制的所有图表的尺寸；

其中，可视区域的尺寸小于或等于目标尺寸，可视区域的尺寸与第二画布的尺寸相同。

可选的，第一获取模块1201获取图形元素集的流程，包括：

获取展示原始数据集中的原始数据所需图表的目标类型，并获取目标类型的图表的配置数据；

基于原始数据集对配置数据进行解析处理，得到图形元素集。

可选的，若图形元素集中的一个图形元素是基于原始数据集中的一个或多个原始数据解析得到的，则该图形元素与一个或多个原始数据之间具有关联关系；

绘制模块1203根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据的方式，包括：

从原始数据集中，筛选出与第二图形元素具有关联关系的原始数据，作为目标原始数据。

可选的，第二画布显示于终端界面上，终端界面上包含第一滚动条和第二滚动条，第一滚动条用于在第一方向上对可视区域进行滚动变化，第二滚动条用于在第二方向上对可视区域进行滚动变化；第一滚动条用于滚动的总距离等于第一画布在第一方向上的尺寸，第二滚动条用于滚动的总距离等于第一画布在第二方向上的尺寸；

第二获取模块1202获取第一画布中的可视区域的方式，包括：

获取第一滚动条所滚动的第一距离及第二滚动条所滚动的第二距离；

基于第一距离和第二距离，在第一画布中确定可视区域。

可选的，第一画布具有坐标系，坐标系包括第一方向上的第一坐标轴、及第二方向上的第二坐标轴；第二获取模块1202基于第一距离和第二距离，在第一画布中确定可视区域的方式，包括：

基于第一距离获取第一坐标值，并基于第二距离获取第二坐标值；第一坐标值用于在第一坐标轴上指示可视区域在第一画布中的位置，第二坐标值用于在第二坐标轴上指示可视区域在第一画布中的位置；

基于第一坐标值和第二坐标值，构建坐标系中的目标坐标；

其中，可视区域在第一画布中的位置是由目标坐标和可视区域的尺寸进行结合确定。

可选的，第二获取模块1202基于第一距离获取第一坐标值，并基于第二距离获取第二坐标值的方式，包括：

获取可视区域在第一方向上的第一初始坐标值，并对第一初始坐标值与第一距离进行加和处理，得到第一坐标值；以及，

获取可视区域在第二方向上的第二初始坐标值，并对第二初始坐标值与第二距离进行加和处理，得到第二坐标值。

可选的，可视区域为矩形区域，目标坐标是可视区域的任一顶角在第一画布中的位置坐标，第一方向是水平方向，第二方向是垂直方向，目标尺寸包含可视区域在水平方向上的长度以及在垂直方向上的宽度；

其中，可视区域是基于任一顶角的位置坐标、水平方向上的长度以及垂直方向上的宽度，在第一画布上所确定的矩形区域。

可选的，第一画布按照树状结构被划分为M层子画布，M为正整数，第i层的任一子画布被划分为第i+1层的N个子画布，N个子画布均为任一子画布的下一子画布，M、i和N均为正整数，且i小于M；

第二获取模块1202基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素的方式，包括：

对树状结构中的M层子画布从上往下依次进行层层遍历；

基于遍历到的子画布、可视区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素。

可选的，第二获取模块1202基于遍历到的子画布、可视区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素的方式，包括：

对遍历到的子画布与可视区域进行相交计算；

若遍历到的第i层的任一子画布与可视区域不相交，则停止对任一子画布的下一子画布的遍历；

若遍历到的第i层的任一子画布与可视区域相交，则继续遍历任一子画布的下一子画布；

将在第M层子画布中遍历到的、且与可视区域相交的子画布，作为需绘制的子画布；

将图形元素集中元素位置处于需绘制的子画布内的图形元素，均确定为第一图形元素。

可选的，第一画布中的可视区域的位置支持动态变化；第二获取模块1202获取第一画布中的可视区域的方式，包括：

获取第一画布中的目标可视区域；目标可视区域是第一画布中当前的可视区域；

第二获取模块1202基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素的方式，包括：

若目标可视区域存在上一可视区域，则基于目标可视区域和上一可视区域，从图形元素集中筛选出第一图形元素；

其中，上一可视区域是第一画布中的可视区域变化为目标可视区域之前的可视区域。

可选的，第二获取模块1202基于目标可视区域和上一可视区域，从图形元素集中筛选出第一图形元素的方式，包括：

获取目标可视区域与上一可视区域之间的重叠区域，并将目标可视区域中除重叠区域之外的区域确定为更新区域；

基于更新区域及各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出第一图形元素。

可选的，显示模块1204在第二画布中显示第二图形元素及目标原始数据的方式，包括：

在第二画布中，显示绘制得到的位于更新区域内的第二图形元素及目标原始数据；以及，

在第二画布中，显示在上一可视区域的重叠区域内已绘制的图形元素、以及已绘制的图形元素关联的原始数据。

可选的，上述数据处理装置120还用于：

若接收到针对第二画布上显示的第三图形元素所触发的修改操作，则根据修改操作获取第一画布中的元素修改区域；

根据修改操作，在第一画布中对元素修改区域内的图形元素进行重新绘制；

在第二画布中，显示重新绘制的图形元素及重新绘制的图形元素关联的原始数据。

可选的，上述数据处理装置120根据修改操作获取第一画布中的元素修改区域的方式，包括：

若修改操作不用于修改第三图形元素的元素位置，则将第三图形元素被触发修改操作时在第一画布中所在的元素区域，确定为元素修改区域；以及，

若修改操作用于修改第三图形元素的元素位置，则将第三图形元素被触发修改操作时在第一画布中所在的元素区域、以及第三图形元素在第一画布中待被修改至的元素区域，均确定为元素修改区域。

可选的，上述数据处理装置120根据修改操作，在第一画布中对元素修改区域内的图形元素进行重新绘制的方式，包括：

若元素修改区域有多个，则对多个元素修改区域中相邻的元素修改区域进行合并处理，得到至少一个合并修改区域；

根据修改操作，在第一画布中对至少一个合并修改区域内的图形元素进行重新绘制。

根据本申请的一个实施例，图3所示的数据处理方法所涉及的步骤可由图12所示的数据处理装置120中的各个模块来执行。例如，图3中所示的步骤S101可由图12中的第一获取模块120来执行，图3中所示的步骤S102可由图12中的第二获取模块1202来执行；图3中所示的步骤S103可由图12中的绘制模块1203来执行，图3中所示的步骤S104可由图12中的显示模块1204来执行。

本申请获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。由此可见，本申请可以在第一画布上来进行图形元素的绘制，由于第一画布的尺寸是动态的，因此，不论需要绘制多少数量的图形元素，都能够在动态尺寸的第一画布上实现，使得本申请对需要绘制的图形元素的数量可以是无限制的；并且，第一画布还可以具有可视区域，本申请可以根据该可视区域来筛选当前需要绘制的图形元素，如可以只绘制与该可视区域相关联的图形元素（如第一图形元素），而无需一次性绘制图形元素集中的全部图形元素，因此，还可以提升对图形元素进行绘制的效率，从而可以提升对图形元素进行显示的及时性，综此，采用本申请提供的装置可以提升对图形元素进行绘制以及显示的性能。

根据本申请的一个实施例，图12所示的数据处理装置120中的各个模块可以分别或全部合并为一个或若干个单元来构成，或者其中的某个（些）单元还可以再拆分为功能上更小的多个子单元，可以实现同样的操作，而不影响本申请的实施例的技术效果的实现。上述模块是基于逻辑功能划分的，在实际应用中，一个模块的功能也可以由多个单元来实现，或者多个模块的功能由一个单元实现。在本申请的其它实施例中，数据处理装置120也可以包括其它单元，在实际应用中，这些功能也可以由其它单元协助实现，并且可以由多个单元协作实现。

本申请实施例中，术语“模块”或“单元”是指有预定功能的计算机程序或计算机程序的一部分，并与其他相关部分一起工作以实现预定目标，并且可以通过使用软件、硬件（如处理电路或存储器）或其组合来全部或部分实现。同样的，一个处理器（或多个处理器或存储器）可以用来实现一个或多个模块或单元。此外，每个模块或单元都可以是包含该模块或单元功能的整体模块或单元的一部分。

根据本申请的一个实施例，可以在通用计算机设备（该计算机设备可以包含中央处理单元（CPU）、随机存取存储介质（RAM）、只读存储介质（ROM）等处理元件和存储元件）上，运行能够执行本申请各实施例中所示的相应方法所涉及的各步骤的计算机程序，来构造如图12中所示的数据处理装置120。上述计算机程序可以记载于如计算机可读记录介质上，且可以通过该计算机可读记录介质装载于上述计算机设备中，并在其中运行。

请参见图13，图13是本申请实施例提供的一种计算机设备的结构示意图。如图13所示，计算机设备1000可以包括：处理器1001，网络接口1004和存储器1005，此外，在一些实施例中，计算机设备1000还可以包括：用户接口1003，和至少一个通信总线1002。其中，通信总线1002用于实现这些组件之间的连接通信。其中，用户接口1003可以包括显示屏（Display）、键盘（Keyboard），可选用户接口1003还可以包括标准的有线接口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口（如WI-FI接口）。存储器1005可以是高速RAM存储器，也可以是非不稳定的存储器（non-volatile memory），例如至少一个磁盘存储器。存储器1005可选的还可以是至少一个位于远离前述处理器1001的存储装置。如图13所示，作为一种计算机存储介质的存储器1005中可以包括操作系统、网络通信模块、用户接口模块以及设备控制应用程序。

在图13所示的计算机设备1000中，网络接口1004可提供网络通讯功能；而用户接口1003主要用于为用户提供输入的接口；而处理器1001可以用于调用存储器1005中存储的设备控制应用程序，以实现：

获取原始数据集和图形元素集；原始数据集包含需采用图表进行展示的多个原始数据；图形元素集包含用于绘制图表的多个图形元素，图形元素集中还包含各个图形元素在第一画布中对应的元素位置；第一画布的尺寸为动态尺寸；

获取第一画布中的可视区域，并基于可视区域及图形元素集中各个图形元素在第一画布中对应的元素位置，从图形元素集中筛选出需绘制的第一图形元素；

在第一画布中绘制第一图形元素，并根据绘制得到的位于可视区域内的第二图形元素，从原始数据集中筛选出需展示的目标原始数据；

在第二画布中显示第二图形元素及目标原始数据；第二画布是用于展示原始数据的画布。

应当理解，本申请实施例中所描述的计算机设备1000可执行本申请各实施例中对上述数据处理方法的描述，也可执行前文图12所对应实施例中对上述数据处理装置120的描述，在此不再赘述。另外，对采用相同方法的有益效果描述，也不再进行赘述。

此外，这里需要指出的是：本申请还提供了一种计算机可读存储介质，且计算机可读存储介质中存储有计算机程序，当处理器执行该计算机程序时，能够执行本申请各实施例中对数据处理方法的描述，因此，这里将不再进行赘述。另外，对采用相同方法的有益效果描述，也不再进行赘述。对于本申请所涉及的计算机存储介质实施例中未披露的技术细节，请参照本申请方法实施例的描述。

作为示例，上述计算机程序可被部署在一个计算机设备上执行，或者被部署位于一个地点的多个计算机设备上执行，又或者，在分布在多个地点且通过通信网络互连的多个计算机设备上执行，分布在多个地点且通过通信网络互连的多个计算机设备可以组成区块链网络。

上述计算机可读存储介质可以是上述计算机设备的内部存储单元，例如计算机设备的硬盘或内存。该计算机可读存储介质也可以是该计算机设备的外部存储设备，例如该计算机设备上配备的插接式硬盘，智能存储卡（smart media card，SMC），安全数字（securedigital，SD）卡，闪存卡（flash card）等。进一步地，该计算机可读存储介质还可以既包括该计算机设备的内部存储单元也包括外部存储设备。该计算机可读存储介质用于存储该计算机程序以及该计算机设备所需的其他程序和数据。该计算机可读存储介质还可以用于暂时地存储已经输出或者将要输出的数据。

本申请提供了一种计算机程序产品，该计算机程序产品包括计算机程序，该计算机程序存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机程序，处理器执行该计算机程序，使得该计算机设备执行本申请各实施例中对上述数据处理方法的描述，因此，这里将不再进行赘述。另外，对采用相同方法的有益效果描述，也不再进行赘述。对于本申请所涉及的计算机可读存储介质实施例中未披露的技术细节，请参照本申请方法实施例的描述。

本申请实施例的说明书和权利要求书及附图中的术语“第一”、“第二”等是用于区别不同对象，而非用于描述特定顺序。此外，术语“包括”以及它们任何变形，意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、装置、产品或设备没有限定于已列出的步骤或模块，而是可选地还包括没有列出的步骤或模块，或可选地还包括对于这些过程、方法、装置、产品或设备固有的其他步骤单元。

本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本申请的范围。

以上所揭露的仅为本申请较佳实施例而已，当然不能以此来限定本申请之权利范围，因此依本申请权利要求所作的等同变化，仍属本申请所涵盖的范围。

Claims (20)

1.一种数据处理方法，其特征在于，所述方法包括：

获取原始数据集和图形元素集；所述原始数据集包含需采用图表进行展示的多个原始数据；所述图形元素集包含用于绘制所述图表的多个图形元素，所述图形元素集中还包含各个图形元素在第一画布中对应的元素位置；所述第一画布的尺寸为动态尺寸；

获取所述第一画布中的可视区域，并基于所述可视区域及所述图形元素集中各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出需绘制的第一图形元素；

在所述第一画布中绘制所述第一图形元素，并根据绘制得到的位于所述可视区域内的第二图形元素，从所述原始数据集中筛选出需展示的目标原始数据；

在第二画布中显示所述第二图形元素及所述目标原始数据；所述第二画布是用于展示原始数据的画布。

2.如权利要求1所述的方法，其特征在于，所述第一画布的尺寸被延伸至目标尺寸，所述目标尺寸是能够容纳基于所述图形元素集所需绘制的所有图表的尺寸；

其中，所述可视区域的尺寸小于或等于所述目标尺寸，所述可视区域的尺寸与所述第二画布的尺寸相同。

3.如权利要求1所述的方法，其特征在于，获取所述图形元素集的流程，包括：

获取展示所述原始数据集中的原始数据所需图表的目标类型，并获取所述目标类型的图表的配置数据；

基于所述原始数据集对所述配置数据进行解析处理，得到所述图形元素集。

4.如权利要求3所述的方法，其特征在于，若所述图形元素集中的一个图形元素是基于所述原始数据集中的一个或多个原始数据解析得到的，则该图形元素与所述一个或多个原始数据之间具有关联关系；

所述根据绘制得到的位于所述可视区域内的第二图形元素，从所述原始数据集中筛选出需展示的目标原始数据，包括：

从所述原始数据集中，筛选出与所述第二图形元素具有关联关系的原始数据，作为所述目标原始数据。

5.如权利要求1所述的方法，其特征在于，所述第二画布显示于终端界面上，所述终端界面上包含第一滚动条和第二滚动条，所述第一滚动条用于在第一方向上对所述可视区域进行滚动变化，所述第二滚动条用于在第二方向上对所述可视区域进行滚动变化；所述第一滚动条用于滚动的总距离等于所述第一画布在所述第一方向上的尺寸，所述第二滚动条用于滚动的总距离等于所述第一画布在所述第二方向上的尺寸；

所述获取所述第一画布中的可视区域，包括：

获取所述第一滚动条所滚动的第一距离及所述第二滚动条所滚动的第二距离；

基于所述第一距离和所述第二距离，在所述第一画布中确定所述可视区域。

6.如权利要求5所述的方法，其特征在于，所述第一画布具有坐标系，所述坐标系包括所述第一方向上的第一坐标轴、及所述第二方向上的第二坐标轴；所述基于所述第一距离和所述第二距离，在所述第一画布中确定所述可视区域，包括：

基于所述第一距离获取第一坐标值，并基于所述第二距离获取第二坐标值；所述第一坐标值用于在所述第一坐标轴上指示所述可视区域在所述第一画布中的位置，所述第二坐标值用于在所述第二坐标轴上指示所述可视区域在所述第一画布中的位置；

基于所述第一坐标值和所述第二坐标值，构建所述坐标系中的目标坐标；

其中，所述可视区域在所述第一画布中的位置是由所述目标坐标和所述可视区域的尺寸进行结合确定。

7.如权利要求5所述的方法，其特征在于，所述基于所述第一距离获取第一坐标值，并基于所述第二距离获取第二坐标值，包括：

获取所述可视区域在所述第一方向上的第一初始坐标值，并对所述第一初始坐标值与所述第一距离进行加和处理，得到所述第一坐标值；以及，

获取所述可视区域在所述第二方向上的第二初始坐标值，并对所述第二初始坐标值与所述第二距离进行加和处理，得到所述第二坐标值。

8.如权利要求6所述的方法，其特征在于，所述可视区域为矩形区域，所述目标坐标是所述可视区域的任一顶角在所述第一画布中的位置坐标，所述第一方向是水平方向，所述第二方向是垂直方向，所述可视区域的尺寸包含所述可视区域在所述水平方向上的长度以及在所述垂直方向上的宽度；

其中，所述可视区域是基于所述任一顶角的位置坐标、所述水平方向上的长度以及所述垂直方向上的宽度，在所述第一画布上所确定的矩形区域。

9.如权利要求1所述的方法，其特征在于，所述第一画布按照树状结构被划分为M层子画布，M为正整数，第i层的任一子画布被划分为第i+1层的N个子画布，所述N个子画布均为所述任一子画布的下一子画布，M、i和N均为正整数，且i小于M；

所述基于所述可视区域及所述图形元素集中各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出需绘制的第一图形元素，包括：

对所述树状结构中的所述M层子画布从上往下依次进行层层遍历；

基于遍历到的子画布、所述可视区域及所述各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出所述第一图形元素。

10.如权利要求9所述的方法，其特征在于，所述基于遍历到的子画布、所述可视区域及所述各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出所述第一图形元素，包括：

对遍历到的子画布与所述可视区域进行相交计算；

若遍历到的所述第i层的任一子画布与所述可视区域不相交，则停止对所述任一子画布的下一子画布的遍历；

若遍历到的所述第i层的任一子画布与所述可视区域相交，则继续遍历所述任一子画布的下一子画布；

将在第M层子画布中遍历到的、且与所述可视区域相交的子画布，作为需绘制的子画布；

将所述图形元素集中元素位置处于所述需绘制的子画布内的图形元素，均确定为所述第一图形元素。

11.如权利要求1所述的方法，其特征在于，所述第一画布中的可视区域的位置支持动态变化；所述获取所述第一画布中的可视区域，包括：

获取所述第一画布中的目标可视区域；所述目标可视区域是所述第一画布中当前的可视区域；

所述基于所述可视区域及所述图形元素集中各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出需绘制的第一图形元素，包括：

若所述目标可视区域存在上一可视区域，则基于所述目标可视区域和所述上一可视区域，从所述图形元素集中筛选出所述第一图形元素；

其中，所述上一可视区域是所述第一画布中的可视区域变化为所述目标可视区域之前的可视区域。

12.如权利要求11所述的方法，其特征在于，所述基于所述目标可视区域和所述上一可视区域，从所述图形元素集中筛选出所述第一图形元素，包括：

获取所述目标可视区域与所述上一可视区域之间的重叠区域，并将所述目标可视区域中除所述重叠区域之外的区域确定为更新区域；

基于所述更新区域及所述各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出所述第一图形元素。

13.如权利要求12所述的方法，其特征在于，所述在第二画布中显示所述第二图形元素及所述目标原始数据，包括：

在所述第二画布中，显示绘制得到的位于所述更新区域内的所述第二图形元素及所述目标原始数据；以及，

在所述第二画布中，显示在所述上一可视区域的所述重叠区域内已绘制的图形元素、以及所述已绘制的图形元素关联的原始数据。

14.如权利要求1所述的方法，其特征在于，所述方法还包括：

若接收到针对所述第二画布上显示的第三图形元素所触发的修改操作，则根据所述修改操作获取所述第一画布中的元素修改区域；

根据所述修改操作，在所述第一画布中对所述元素修改区域内的图形元素进行重新绘制；

在所述第二画布中，显示重新绘制的图形元素及所述重新绘制的图形元素关联的原始数据。

15.如权利要求14所述的方法，其特征在于，所述根据所述修改操作获取所述第一画布中的元素修改区域，包括：

若所述修改操作不用于修改所述第三图形元素的元素位置，则将所述第三图形元素被触发所述修改操作时在所述第一画布中所在的元素区域，确定为所述元素修改区域；以及，

若所述修改操作用于修改所述第三图形元素的元素位置，则将所述第三图形元素被触发所述修改操作时在所述第一画布中所在的元素区域、以及所述第三图形元素在所述第一画布中待被修改至的元素区域，均确定为所述元素修改区域。

16.如权利要求14所述的方法，其特征在于，所述根据所述修改操作，在所述第一画布中对所述元素修改区域内的图形元素进行重新绘制，包括：

若所述元素修改区域有多个，则对多个元素修改区域中相邻的元素修改区域进行合并处理，得到至少一个合并修改区域；

根据所述修改操作，在所述第一画布中对所述至少一个合并修改区域内的图形元素进行重新绘制。

17.一种数据处理装置，其特征在于，所述装置包括：

第一获取模块，用于获取原始数据集和图形元素集；所述原始数据集包含需采用图表进行展示的多个原始数据；所述图形元素集包含用于绘制所述图表的多个图形元素，所述图形元素集中还包含各个图形元素在第一画布中对应的元素位置；所述第一画布的尺寸为动态尺寸；

第二获取模块，用于获取所述第一画布中的可视区域，并基于所述可视区域及所述图形元素集中各个图形元素在所述第一画布中对应的元素位置，从所述图形元素集中筛选出需绘制的第一图形元素；

绘制模块，用于在所述第一画布中绘制所述第一图形元素，并根据绘制得到的位于所述可视区域内的第二图形元素，从所述原始数据集中筛选出需展示的目标原始数据；

显示模块，用于在第二画布中显示所述第二图形元素及所述目标原始数据；所述第二画布是用于展示原始数据的画布。

18.一种计算机程序产品，其特征在于，包括计算机程序，该计算机程序被处理器执行时实现权利要求1-16任一项所述方法的步骤。

19.一种计算机设备，其特征在于，包括存储器和处理器，所述存储器存储有计算机程序，所述计算机程序被所述处理器执行时，使得所述处理器执行权利要求1-16中任一项所述方法的步骤。

20.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序适用于由处理器加载并执行权利要求1-16任一项所述的方法。