CN114968238A - 图表绘制方法、装置、设备、以及计算机可读存储介质 - Google Patents

Abstract

本申请公开了一种图表绘制方法、装置、设备、以及计算机可读存储介质，方法包括：当图表绘制展示模块获取到用户针对目标数据触发的图表绘制请求之后，先由图表绘制展示模块生成目标数据的图表描述信息；再由图表绘制展示模块将图表描述信息发送给图表库使用模块；然后，由图表绘制展示模块对图表库使用模块反馈的第一绘制过程描述数据进行解析处理，得到第一解析结果，以使第一解析结果能够表示针对目标数据的图表绘制过程；最后，由图表绘制展示模块按照第一解析结果，绘制并展示目标数据的待展示图表，如此能够实现由用户利用图表绘制展示模块进行图表绘制的目的，从而能够实现不同种类的APP均可以调用同一个图表库的目的。

Description

图表绘制方法、装置、设备、以及计算机可读存储介质

技术领域

本申请涉及计算机技术领域，尤其涉及一种图表绘制方法、装置、设备、以及计算机可读存储介质。

背景技术

随着计算机技术的发展，电子设备(例如，手机、笔记本等)的普及程度越来越大。

另外，随着用户需求的不断增加，电子设备所能实现的功能也越来越多。例如，用户可以借助电子设备中某个应用程序(Application，APP)绘制图表，以使该图表能够以更直观的方式呈现出该用户所关心的一些数据(例如，某些产品的日销售量走势、某些图书的年借阅量等)。

实际上，一些用户有可能希望其能够借助不同种类的APP(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、基于Flutter技术栈的APP等)进行图表绘制，以满足这些用户在不同应用场景(例如，利用电脑进行办公、利用手机进行娱乐等)下的图表绘制需求。

然而，由于不同种类的APP通常是采用不同技术栈进行实现的，如此导致如何实现利用不同种类的APP调用同一个图表库(例如，基于JS语法的图表库等)成为一个亟待解决的技术问题。

发明内容

为了解决上述技术问题，本申请提供了一种图表绘制方法、装置、设备、以及计算机可读存储介质，能够实现利用不同种类的APP调用同一个图表库(例如，基于JS语法的图表库等)的目的。

为了实现上述目的，本申请实施例提供的技术方案如下：

本申请实施例提供一种图表绘制方法，应用于图表绘制展示模块，所述方法包括：

在获取到用户针对目标数据触发的图表绘制请求之后，生成所述目标数据的图表描述信息；

将所述图表描述信息发送给图表库使用模块；

在获取到所述图表库使用模块针对所述图表描述信息反馈的第一绘制过程描述数据之后，对所述第一绘制过程描述数据进行解析处理，得到第一解析结果；其中，所述第一解析结果用于表示针对所述目标数据的图表绘制过程；

按照所述第一解析结果，绘制并展示所述目标数据的待展示图表。

在一种可能的实施方式中，所述图表库使用模块，用于利用待使用图表库在模拟画布上针对所述目标数据进行图表绘制，得到所述第一绘制过程描述数据。

在一种可能的实施方式中，所述图表绘制展示模块包括真实画布；所述真实画布的实现技术栈不同于所述模拟画布的实现技术栈。

在一种可能的实施方式中，所述图表绘制展示模块包括真实画布；所述第一解析结果用于描述在所述真实画布上针对所述目标数据的图表绘制过程。

在一种可能的实施方式中，所述展示所述目标数据的待展示图表之后，所述方法还包括：

在获取到所述用户针对所述待展示图表的触发操作之后，获取所述触发操作的事件描述信息；

将所述事件描述信息和所述待展示图表的图表标识发送给所述图表库使用模块；

在获取到所述图表库使用模块针对所述事件描述信息和所述待展示图表的图表标识反馈的第二绘制过程描述数据之后，对所述第二绘制过程描述数据进行解析处理，得到第二解析结果；

按照所述第二解析结果，绘制并展示所述触发操作的响应图表。

本申请实施例还提供了一种图表绘制装置，包括：

信息生成单元，用于在获取到用户针对目标数据触发的图表绘制请求之后，生成所述目标数据的图表描述信息；

第一发送单元，用于将所述图表描述信息发送给图表库使用模块；

第一解析单元，用于在获取到所述图表库使用模块针对所述图表描述信息反馈的第一绘制过程描述数据之后，对所述第一绘制过程描述数据进行解析处理，得到第一解析结果；其中，所述第一解析结果用于表示针对所述目标数据的图表绘制过程；

第一展示单元，用于按照所述第一解析结果，绘制并展示所述目标数据的待展示图表。

本申请实施例还提供了一种图表绘制系统，包括图表绘制展示模块和图表库使用模块；其中，所述图表绘制展示模块用于执行本申请实施例提供的图表绘制方法的任一实施方式；

所述图表库使用模块用于利用待使用图表库针对所述图表绘制展示模块提供的图表需求信息进行图表绘制，得到所述图表需求信息对应的图表绘制过程数据，并将所述图表绘制过程数据反馈给所述图表绘制展示模块。

本申请实施例还提供了一种设备，所述设备包括处理器以及存储器：

所述存储器用于存储计算机程序；

所述处理器用于根据所述计算机程序执行本申请实施例提供的图表绘制方法的任一实施方式。

本申请实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质用于存储计算机程序，所述计算机程序用于执行本申请实施例提供的图表绘制方法的任一实施方式。

本申请实施例还提供了一种计算机程序产品，所述计算机程序产品在终端设备上运行时，使得所述终端设备执行本申请实施例提供的图表绘制方法的任一实施方式。

与现有技术相比，本申请实施例至少具有以下优点：

本申请实施例提供的技术方案中，对于图表绘制展示模块(例如，基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)来说，当该图表绘制展示模块获取到用户针对目标数据(例如，某个产品在2021年中每一天的日销售量等)触发的图表绘制请求之后，先由该图表绘制展示模块生成该目标数据的图表描述信息，以使该图表描述信息能够描述出针对该目标数据的图表绘制需求(例如，以折线图形式表示出该目标数据等)；再由该图表绘制展示模块将该图表描述信息发送给图表库使用模块，以使该图表库使用模块能够借助其所能调用的图表库(例如，基于JS语法的图表库)以及该图表描述信息，模拟出针对该目标数据的图表绘制过程，得到第一绘制过程描述数据，并由该图表库使用模块将该第一绘制过程描述数据发送给图表绘制展示模块；然后，由该图表绘制展示模块对第一绘制过程描述数据进行解析处理，得到第一解析结果，以使该第一解析结果能够表示针对目标数据的图表绘制过程(尤其是，该第一解析结果能够按照该图表绘制展示模块所能理解的方式表示针对目标数据的图表绘制过程)；最后，由该图表绘制展示模块按照该第一解析结果，绘制并展示该目标数据的待展示图表，以使该待展示图表能够满足该用户针对该目标数据的图表绘制需求，如此能够实现由用户利用图表绘制展示模块进行图表绘制的目的。

可见，因图表绘制展示模块是基于第一绘制过程描述数据所描述的图表绘制过程进行图表绘制的，而非通过直接调用图表库进行图表绘制的，使得该图表绘制展示模块在进行图表绘制时无需考虑该图表绘制展示模块所使用的技术栈是否与可调用该图表库的技术栈保持一致，从而使得无论该图表绘制展示模块所使用的技术栈是什么，该图表绘制展示模块都可以通过与该图表库使用模块之间的数据交互过程实现图表绘制过程，如此能够有效地解决因该图表绘制展示模块所使用的技术栈(例如，Flutter技术栈)不同于可调用图表库的技术栈(例如，网页开发技术栈等)，而导致该图表绘制展示模块无法直接调用该图表库这一问题，从而能够实现不同种类的APP(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)均可以调用同一个图表库的目的。

附图说明

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

图1为本申请实施例提供的一种图表绘制方法的流程图；

图2为本申请实施例提供的图表绘制过程的工作原理示意图；

图3为本申请实施例提供的一种渲染流程的示意图；

图4为本申请实施例提供的一种事件流程的示意图；

图5为本申请实施例提供的一种原生API的示意图；

图6为本申请实施例提供的一种图表绘制装置的结构示意图；

图7为本申请实施例提供的一种图表绘制系统的结构示意图。

具体实施方式

为了便于理解本申请，下面介绍一些本申请所涉及的技术名词。

安卓(Android)，是一种自由及开放源代码的操作系统；而且Android主要使用于移动设备(例如，智能手机和平板电脑)。

IOS是由苹果公司开发的移动操作系统；而且IOS主要使用于苹果公司旗下的移动设备(例如，苹果手机等)。

Flutter是谷歌开源的构建用户界面工具包，帮助开发者通过一套代码库高效构建多平台精美应用，支持移动、浏览器、桌面和嵌入式平台。

基于JavaScript(简称，JS)语法的图表库，是针对浏览器(web)进行设计的，以使当利用该图表库在web画布(Canvas)上进行渲染时，该图表库能够提供直观、生动、可交互、以及可个性化定制的数据图表(例如，折线图、柱状图、散点图、K线图、饼图)、雷达图、地图、和弦图、力导布局图等)。其中，web以及web画布均是基于网页开发技术栈进行实现的。

应用程序接口(Application Programming Interface，API)，是软件系统不同组成部分衔接的约定。

基于上述技术名词，下面开始介绍本申请的相关内容。

发明人在针对图表库的研究中发现，对于一个图表库(例如，基于JS语法的图表库)来说，该图表库通常只能被某种应用程序直接调用(例如，基于JS语法的图表库只能被web直接调用)，如此导致图表库的应用范围受限，从而导致用户的图表绘制体验比较差。为了便于理解，下面结合示例进行说明。

作为示例，对于针对web构建的基于JS语法的图表库来说，可调用该图表库的技术栈就是网页开发技术栈，以使该图表库可以被基于网页开发技术栈的web直接调用；但是，因除了web以外其他种类的APP所使用的技术栈(例如，Android技术栈、IOS技术栈、Flutter技术栈等)完全不同于网页开发技术栈，使得这些APP无法直接调用该图表库，如此导致用户只能借助web这一种APP进行图表绘制，从而导致无法满足该用户想要借助除了web以外其他种类的APP进行图表绘制的用户需求，进而导致该用户的图表绘制体验比较差。

发明人还发现，为了解决上述“图表库的应用范围受限”这一问题，对于除了web以外其他种类的APP来说，可以在这些APP中内嵌网页视图(webview)，以使这些APP能够借助该网页视图实现图表绘制；但是，这种方式存在的缺陷是：当多个图形共存时，内存占用高，加载速度慢；而且对于基于Flutter技术栈的APP来说，图形渲染效果存在劣化现象。可见，对于基于网页视图的技术方案来说，该技术方案虽然能够解决上述“图表库的应用范围受限”这一问题，但是因该技术方案依旧存在一些缺陷而导致该技术方案的图表绘制效果不太好，从而导致用户的图表绘制体验比较差。

发明人还发现，为了解决上述“图表库的应用范围受限”这一问题，对于除了web以外其他种类的APP来说，可以使用这些APP的原生技术(例如，Android、IOS、Flutter等)重新开发一套相同的图表库，以使这些APP能够通过分别调用其对应图表库的方式实现图表绘制；但是这种方式存在的缺陷是：开发成本和维护成本都比较高。

基于上述发现，为了解决背景技术部分所示的技术问题，本申请实施例提供了一种图表绘制方法，该方法包括：当图表绘制展示模块(例如，基于Flutter技术栈的APP等)获取到用户针对目标数据触发的图表绘制请求之后，先由该图表绘制展示模块生成该目标数据的图表描述信息，以使该图表描述信息能够描述出针对该目标数据的图表绘制需求(例如，以折线图形式表示出该目标数据等)；再由该图表绘制展示模块将该图表描述信息发送给图表库使用模块，以使该图表库使用模块能够借助其所能调用的图表库(例如，基于JS语法的图表库)以及该图表描述信息，模拟出针对该目标数据的图表绘制过程，得到第一绘制过程描述数据，并由该图表库使用模块将该第一绘制过程描述数据发送给图表绘制展示模块；然后，由该图表绘制展示模块对第一绘制过程描述数据进行解析处理，得到第一解析结果，以使该第一解析结果能够表示针对目标数据的图表绘制过程(尤其是，该第一解析结果能够按照该图表绘制展示模块所能理解的方式表示针对目标数据的图表绘制过程)；最后，由该图表绘制展示模块按照该第一解析结果，绘制并展示该目标数据的待展示图表，以使该待展示图表能够满足该用户针对该目标数据的图表绘制需求，如此能够实现由用户利用图表绘制展示模块进行图表绘制的目的。

可见，因图表绘制展示模块是基于第一绘制过程描述数据所描述的图表绘制过程进行图表绘制的，而非通过直接调用图表库进行图表绘制的，使得该图表绘制展示模块在进行图表绘制时无需考虑该图表绘制展示模块所使用的技术栈是否与可调用该图表库的技术栈保持一致，从而使得无论该图表绘制展示模块所使用的技术栈是什么，该图表绘制展示模块都可以通过与该图表库使用模块之间的数据交互过程实现图表绘制过程，如此能够有效地解决因该图表绘制展示模块所使用的技术栈(例如，Flutter技术栈)不同于可调用图表库的技术栈(例如，网页开发技术栈等)，而导致该图表绘制展示模块无法直接调用该图表库这一问题，从而能够实现不同种类的APP(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)均可以调用同一个图表库的目的，如此能够实现跨端一致性。

另外，因图表绘制展示模块是基于图表库使用模块反馈的一些能够描述图表绘制过程的数据信息(例如，脚本等)进行图表绘制的，使得该图表绘制展示模块无需直接调用图表库，从而使得该图表绘制展示模块无需内嵌webview，进而使得该图表绘制展示模块能够有效地克服上文因内嵌webview而存在的缺陷，如此有利于提高用户的图表绘制体验。

此外，无论图表绘制展示模块是采用何种技术栈进行实现，该图表绘制展示模块都能够借助图表库使用模块实现图表绘制过程；而且因该图表库使用模块只需借助一个图表库即可实现图表绘制，使得采用各种技术栈实现的图表绘制展示模块均可以间接地借助同一个图表库实现图表绘制，如此能够有效地避免为了实现在图表绘制展示模块而利用该图表绘制展示模块所使用的技术栈重新开发一套相同图表库的高成本操作，从而能够有效地克服上文因利用各种APP的原生技术重新开发一套相同的图表库而导致的缺陷，从而能够有效地降低开发成本以及维护成本。

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

为了便于理解本申请的技术方案，下面结合一些方法实施例(例如，方法实施例一至方法实施例三)、以及一些附图(例如，图1-图5)介绍本申请实施例提供的应用于图表绘制展示模块的图表绘制方法的相关内容。

方法实施例一

参见图1，该图为本申请实施例提供的一种图表绘制方法的流程图。

本申请实施例提供的图表绘制方法，包括S1-S4：

S1：在图表绘制展示模块获取到用户针对目标数据触发的图表绘制请求之后，该图表绘制展示模块生成该目标数据的图表描述信息。

其中，图表绘制展示模块用于向用户提供图标绘制服务；而且本申请实施例不限定该图表绘制展示模块的实施方式，例如，其可以是电子设备，也可以是能够在电子设备上运行的应用程序(例如，基于Flutter技术栈的APP等)。

另外，本申请实施例不限定电子设备，例如，其可以是终端设备或服务器等数据处理设备。其中，终端设备可以为智能手机、计算机、个人数字助理(Personal DigitalAssitant，PDA)或平板电脑等。服务器可以为独立服务器、集群服务器或云服务器。

目标数据是指需要利用图表进行表示的数据信息；而且本申请实施例不限定该目标数据，例如，其可以包括某个产品在2021年中每一天的日销售量。

图表绘制请求用于请求针对目标数据进行图表绘制处理；而且本申请实施例不限定该图表绘制请求，例如，该图表绘制请求可以携带有目标数据以及该目标数据的图表请求信息，以使该图表绘制请求能够描述出用户针对该目标数据的图表需求。其中，图表请求信息用于表示用户希望将目标数据如何进行图表表示(例如，用户希望将目标数据按照折线图形式进行表示等)。

另外，本申请实施例不限定图表绘制请求的触发方式，例如，其可以由用户通过在图表绘制展示模块的用户界面上执行某种触发操作(例如，点击特定按钮、执行特定手势等)的方式触发该图表绘制请求，以便后续该图表绘制展示模块能够通过针对其预先定义API(例如，图5所示的原生API)调用图表绘制任务。

上文“目标数据的图表描述信息”是指与该目标数据的图表绘制任务相关的信息，以使该“目标数据的图表描述信息”能够描述出针对该目标数据的图表绘制需求。

另外，本申请实施例不限定上述“目标数据的图表描述信息”，例如，如图3所示，其可以包括：由图表绘制展示模块针对该目标数据所创建的第一对象实例的标识(Identitydocument，ID)、以及该第一对象实例的图表配置。其中，第一对象实例用于表示在图表绘制展示模块中对目标数据进行图表绘制的任务。

此外，本申请实施例不限定上述“目标数据的图表描述信息”的生成过程，例如，当图表绘制展示模块是采用Flutter技术栈实现的，则该生成过程可以采用现有的或者未来出现的任意一种适用于由Flutter技术栈生成该目标数据的图表描述信息的方法进行实施。

基于上述S1的相关内容可知，对于一个用户来说，如果该用户想要借助图表绘制展示模块(例如，基于Flutter技术栈的APP等)针对目标数据进行图表绘制，则该用户可以通过该图表绘制展示模块中的用户界面上传目标数据并触发图表绘制请求，以使该图表绘制请求能够表示出该用户想要针对该目标数据的图表绘制需求(例如，采用折线图等)，以便后续由该图表绘制展示模块基于该图表绘制请求，确定该目标数据的图表描述信息(例如，可以由该图表绘制展示模块针对该目标数据创建第一对象实例，并将该第一对象实例的ID以及该第一对象实例的图表配置等作为该目标数据的图表描述信息等)，以使该图表描述信息能够描述出该目标数据的图表绘制需求。

S2：图表绘制展示模块将图表描述信息发送给图表库使用模块。

其中，图表库使用模块用于借助待使用图表库进行图表绘制；而且该图表库使用模块是利用可调用该待使用图表库的技术栈进行实现的。例如，当待使用图表库为基于JS语法的图表库时，图表库使用模块所使用的技术栈就是网页开发技术栈，以使该图表库使用模块所使用的技术栈与可调用该待使用图表库的技术栈保持一致，从而使得该图表库使用模块能够直接调用基于JS语法的图表库进行图表绘制。

实际上，由图表库使用模块所绘制的图表通常不需要直接呈现给用户，使得该图表库使用模块无需在真实画布上进行图表绘制。基于此，本申请实施例提供了图表库使用模块的一种可能的实施方式，在该实施方式中，该图表库使用模块用于利用待使用图表库在模拟画布上进行图表绘制。

其中，模拟画布用于模拟那些可以直接使用待使用图表库绘制图表的真实画布，以使该模拟画布能够尽可能地模拟出该真实画布所具有的图表绘制功能。例如，如果待使用图表库为基于JS语法的图表库，则该待使用图表库的真实画布可以是web画布，而且该模拟画布可以是图2所示的“模拟的画布对象”，以使该模拟画布用于模拟web画布，从而使得该模拟画布能够模拟出由该web画布所能实现的图表绘制功能。

另外，构建模拟画布所使用的技术栈与可调用该待使用图表库的技术栈保持一致。例如，如果待使用图表库为基于JS语法的图表库，则构建模拟画布所使用的技术栈可以是网页开发技术栈。

此外，为了进一步提高图表绘制效果，模拟画布可以是按照万维网联盟(WorldWide Web Consortium，W3C)标准进行构建的。例如，如果待使用图表库为基于JS语法的图表库，则模拟画布可以是按照W3C标准在网页开发技术栈上进行构建的。

另外，本申请实施例不限定上文图表库使用模块的工作原理，例如，其具体可以为：利用待使用图表库针对该图表绘制展示模块提供的图表需求信息进行图表绘制，得到该图表需求信息对应的图表绘制过程数据，并将该图表绘制过程数据反馈给该图表绘制展示模块。

其中，图表需求信息用于描述用户的图表需求；而且本申请实施例不限定该图表需求信息，例如，其可以是上文“目标数据的图表描述信息”。

上文“图表需求信息对应的图表绘制过程数据”用于描述参考该图表需求信息实现的图表绘制过程；而且本申请实施例不限定该“图表需求信息对应的图表绘制过程数据”，例如，其可以是下文“第一绘制过程描述数据”。

为了便于理解图表库使用模块的工作原理，下面结合示例进行说明。

作为示例，如图3所示，图表库使用模块的工作原理具体可以为：当图表库使用模块从图表绘制展示模块接收到目标数据的图表描述信息(例如，第一对象实例的ID以及图表配置等)之后，该图表库使用模块可以创建第二对象实例，以使该第二对象实例能够表示出在该图表库使用模块中针对目标数据进行图表绘制的任务，并由该图表库使用模块将该第二对象实例的ID与第一对象实例的ID进行绑定(例如，建立该第二对象实例的ID与第一对象实例的ID之间的映射关系)，以便后续能够基于该绑定关系获知由图表库使用模块通过执行第二对象实例所得到的图表绘制过程数据是用于提供给在图表绘制展示模块中已创建的第一对象实例的；然后，由该图表库使用模块利用待使用图表库在模拟画布(也就是，图3所示的“模拟的画布对象”)上针对目标数据进行图表绘制，得到第一绘制过程描述数据，以使该第一绘制过程描述数据能够表示出在模拟画布上针对目标数据的图表绘制过程；最后，由该图表库使用模块将该第一绘制过程描述数据发送给图表绘制展示模块，以便后续该图表绘制展示模块能够基于该第一绘制过程描述数据执行第一对象实例，以实现针对目标数据的图表绘制过程。

另外，本申请实施例不限定第一绘制过程描述数据，例如，其可以采用脚本形式(例如，图3所示的图表绘制脚本)进行实施。

需要说明的是，对于图3所示的图表绘制脚本来说，为了更好地表达出序列化过程，可以预先设定在模拟画布上所录制的图表绘制脚本的数据结构(例如，将图表绘制脚本中所涉及的属性名、方法名、字符串等枚举值压缩为数字代号等)，以使后续在该模拟画布上所录制的第一绘制过程描述数据能够按照该数据结构更好地表达出针对目标数据的图表绘制过程。

此外，本申请实施例不限定第一绘制过程描述数据的获取过程，例如，当待使用图表库为基于JS语法的图表库时，该第一绘制过程描述数据的获取过程，具体可以为：由图表库使用模块通过构造Canvas、CanvasRenderingContext、LinearCanvasGradient、RadialCanvasGradient、Pattern等对象的方式，录制针对目标数据的图表绘制脚本，并将该图表绘制脚本，确定为第一绘制过程描述数据。

基于上述S2的相关内容可知，在图表绘制展示模块确定出目标数据的图表描述信息之后，由该图表绘制展示模块将该图表描述信息发送给图表库使用模块，以使该图表库使用模块能够参考该图表描述信息，并利用待使用图表库在模拟画布上针对该目标数据进行图表绘制，得到第一绘制过程描述数据，以使该第一绘制过程描述数据能够表示出在模拟画布上针对该目标数据的图表绘制过程，随后由该图表库使用模块将该第一绘制过程描述数据反馈给图表绘制展示模块，以使该图表绘制展示模块能够从该第一绘制过程描述数据中提炼出针对目标数据的图表绘制过程。

需要说明的是，本申请实施例不限定图表绘制展示模块与图表库使用模块之间的通信方式，例如，其可以采用图2-图5所示的跨技术栈通信方式进行实施。

S3：在图表绘制展示模块获取到图表库使用模块针对图表描述信息反馈的第一绘制过程描述数据之后，该图表绘制展示模块对该第一绘制过程描述数据进行解析处理，得到第一解析结果。

其中，第一解析结果用于表示针对目标数据的图表绘制过程，以使该第一解析结果能够描述出在图表绘制展示模块的真实画布(例如，图2所示的“Flutter侧的画布对象”)上针对该目标数据的图表绘制过程。

上述“图表绘制展示模块的真实画布”是指当图表绘制展示模块进行图表绘制时所使用的画布；而且实现该“图表绘制展示模块的真实画布”所使用的技术栈与实现图表绘制展示模块所使用的技术栈相同。

另外，上述“图表绘制展示模块的真实画布”的实现技术栈可以不同于上文“模拟画布”的实现技术栈(也就是，实现上述“图表绘制展示模块的真实画布”所使用的技术栈不同于实现上文“模拟画布”所使用的技术栈)。例如，当图表绘制展示模块是采用Flutter技术栈进行实现的，而且待使用图表库为基于JS语法的图表库时，该图表绘制展示模块中真实画布可以使用Flutter技术栈进行实现，而且图表库使用模块中模拟画布可以使用网页开发技术栈进行实现。

此外，在一些应用场景下，上述“图表绘制展示模块的真实画布”的实现技术栈与上文“模拟画布”的实现技术栈也可以保持一致。例如，当图表绘制展示模块是web，而且待使用图表库为基于JS语法的图表库时，该图表绘制展示模块中真实画布可以使用网页开发技术栈进行实现，而且图表库使用模块中模拟画布也可以使用网页开发技术栈进行实现。

还有，为了进一步提高图表绘制效果，上述“图表绘制展示模块的真实画布”也可以是按照W3C标准进行构造的。

另外，本申请实施例不限定第一解析结果的确定过程，为了便于理解，下文结合示例进行说明。

作为示例，当图表库使用模块是采用网页开发技术栈进行实现的，网页开发技术栈是通过第一表达方式描述针对目标数据的图表绘制过程，图表绘制展示模块是采用Flutter技术栈进行实现的，而且Flutter技术栈是通过第二表达方式描述针对目标数据的图表绘制过程时，上述“第一解析结果的确定过程”具体可以为：将第一绘制过程描述数据从第一表达方式转换成第二表达方式，得到第一解析结果，以使该第一解析结果能够按照该图表绘制展示模块能够理解的方式表达出如何针对目标数据进行图表绘制，从而使得该图表绘制展示模块后续能够参考该第一解析结果实现针对该目标数据的图标绘制。其中，第一表达方式是指在图表库使用模块针对目标数据的图表绘制过程进行描述时所采用的表达方式。第二表达方式是指在图表绘制展示模块针对目标数据的图表绘制过程进行描述时所采用的表达方式。

基于上述S3的相关内容可知，当图表绘制展示模块获取到由图表库使用模块针对图表描述信息反馈的第一绘制过程描述数据之后，该图表绘制展示模块可以针对该第一绘制过程描述数据进行解析，得到第一解析结果，以使该第一解析结果能够描述出在图表绘制展示模块的真实画布上针对该目标数据的图表绘制过程，从而使得该图表绘制展示模块能够从该第一解析结果中了解到如何针对该目标数据进行图表绘制，以便后续该图表绘制展示模块能够参考该第一解析结果实现针对该目标数据的图标绘制。

S4：图表绘制展示模块按照第一解析结果，绘制并展示目标数据的待展示图表。其中，待展示图表用于以图表方式展示目标数据。

本申请实施例中，因第一解析结果能够按照该图表绘制展示模块所能理解的方式表达出如何针对目标数据进行图表绘制，使得在图表绘制展示模块获取到该第一解析结果之后，该图表绘制展示模块可以按照该第一解析结果，在该图表绘制展示模块的真实画布上绘制并展示该目标数据的待展示图表，以使该用户能够从该图表绘制展示模块的用户界面上看到该待展示图表，从而使得该用户能够从该待展示图表中更直观地了解到该目标数据、以及与该目标数据的相关内容(例如，发展趋势等)。

基于上述S1至S4的相关内容可知，对于本申请实施例提供的图表绘制方法来说，当图表绘制展示模块(例如，基于Flutter技术栈的APP等)获取到用户针对目标数据触发的图表绘制请求之后，先由该图表绘制展示模块生成该目标数据的图表描述信息，以使该图表描述信息能够描述出针对该目标数据的图表绘制需求(例如，以折线图形式表示出该目标数据等)；再由该图表绘制展示模块将该图表描述信息发送给图表库使用模块，以使该图表库使用模块能够借助其所能调用的图表库(例如，基于JS语法的图表库)以及该图表描述信息，模拟出针对该目标数据的图表绘制过程，得到第一绘制过程描述数据，并由该图表库使用模块将该第一绘制过程描述数据发送给图表绘制展示模块；然后，由该图表绘制展示模块对第一绘制过程描述数据进行解析处理，得到第一解析结果，以使该第一解析结果能够表示针对目标数据的图表绘制过程(尤其是，该第一解析结果能够按照该图表绘制展示模块所能理解的方式表示针对目标数据的图表绘制过程)；最后，由该图表绘制展示模块按照该第一解析结果，绘制并展示该目标数据的待展示图表，以使该待展示图表能够满足该用户针对该目标数据的图表绘制需求，如此能够实现由用户利用图表绘制展示模块进行图表绘制的目的。

可见，因图表绘制展示模块是基于第一绘制过程描述数据所描述的图表绘制过程进行图表绘制的，而非通过直接调用图表库进行图表绘制的，使得该图表绘制展示模块在进行图表绘制时无需考虑该图表绘制展示模块所使用的技术栈是否与可调用该图表库的技术栈保持一致，从而使得无论该图表绘制展示模块所使用的技术栈是什么，该图表绘制展示模块都可以通过与该图表库使用模块之间的数据交互过程实现图表绘制过程，如此能够有效地解决因该图表绘制展示模块所使用的技术栈(例如，Flutter技术栈)不同于可调用图表库的技术栈(例如，网页开发技术栈等)，而导致该图表绘制展示模块无法直接调用该图表库这一问题，从而能够实现不同种类的APP(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)均可以调用同一个图表库的目的。

需要说明的是，对于图5来说，为了便于更好地理解图5，下面给出图5所示的一些中文词汇所对应的英文，而且这些中英文对照内容具体为：请求图表(call render)；控制器(controller)；绘制模块(Painter)；绘制描述信息(ToolTip Painter)；绘制图表形状(Render Painter)；Flutter侧的画布对象(flutter canvas)；触摸事件(touch enevt)；Flutter侧的通信对象(Flutter Bridge)；包含JS执行容器(containjs runtime)；网页开发技术栈的通信对象(JS Bridge)；创建JS图表(create)；事件管理器(Event Manager)；触发事件(trigger event)；调用画布对象(call canvas)；模拟画布(CanvasRenderdingContext)；录制图表绘制脚本(Record Canvas scripts)；通过模拟画布的画方法触发(trigger by context.draw)。

方法实施例二

实际上，图表绘制展示模块有时需要针对很多用户提供的数据进行图表绘制反馈，故为了进一步提高图表反馈的准确性，本申请实施例还提供了图表绘制方法的另一种可能的实施方式，在该实施方式中，该图表绘制方法可以包括步骤11-步骤14：

步骤11：在图表绘制展示模块获取到用户针对目标数据触发的图表绘制请求之后，该图表绘制展示模块生成该目标数据的图表描述信息，以使该图表描述信息包括针对该目标数据创建的第一对象实例的ID以及图表配置信息。其中，第一对象实例用于表示出由图表绘制展示模块针对目标数据的图表绘制过程所创建的任务。

需要说明的是，步骤11的相关内容请参见上文S1。

步骤12：图表绘制展示模块将图表描述信息发送给图表库使用模块。

需要说明的是，步骤12的相关内容可以参考上文S2。

为了更好地理解步骤12，下面结合示例介绍图表库使用模块的工作原理。

作为示例，对于图表库使用模块来说，在该图表库使用模块接收到由图表绘制展示模块发送的图表描述信息之后，该图表库使用模块可以执行步骤21-步骤25：

步骤21：图表库使用模块根据第一对象实例的图表配置信息，创建第二对象实例，以使该第二对象实例能够表示出由该图表库使用模块针对目标数据的图表绘制过程所创建的任务。

步骤22：图表库使用模块建立第二对象实例的ID与第一对象实例的ID之间的对应关系，以使该第二对象实例的ID与该第一对象实例的ID之间处于绑定状态。

步骤23：图表库使用模块通过调用待使用图表库的方式执行第二对象实例，得到第一绘制过程描述数据，以使该第一绘制过程描述数据能够描述出在该图表库使用模块的模拟画布上如何针对目标数据进行图表绘制。

步骤24：图表库使用模块确定第一绘制过程描述数据的实例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，确定出该第一绘制过程描述数据是由图表库使用模块针对第一对象实例(或者，目标数据等)进行反馈的。

步骤25：图表库使用模块将第一绘制过程描述数据、以及该第一绘制过程描述数据的实例ID描述信息反馈给图表绘制展示模块。

基于上述步骤12的相关内容可知，在图表绘制展示模块确定出目标数据的图表描述信息之后，由该图表绘制展示模块将该图表描述信息发送给图表库使用模块，以使该图表库使用模块能够参考该图表描述信息，确定出第一绘制过程描述数据、以及该第一绘制过程描述数据的实例ID描述信息，以使该第一绘制过程描述数据能够表示出在模拟画布上针对该目标数据的图表绘制过程，并使得该第一绘制过程描述数据的实例ID描述信息能够表示出该第一绘制过程描述数据是由该图表库使用模块针对目标数据(或者，第一对象实例)进行反馈的，随后由该图表库使用模块将该第一绘制过程描述数据、以及该第一绘制过程描述数据的实例ID描述信息均反馈给图表绘制展示模块，以使该图表绘制展示模块能够该实例ID描述信息中获知该第一绘制过程描述数据是针对目标数据(或者，第一对象实例)进行反馈的，并从该第一绘制过程描述数据中提炼出针对目标数据的图表绘制过程。

步骤13：在图表绘制展示模块获取到图表库使用模块针对图表描述信息反馈的第一绘制过程描述数据、以及该第一绘制过程描述数据的实例ID描述信息之后，该图表绘制展示模块根据该第一绘制过程描述数据的实例ID描述信息，确定该第一绘制过程描述数据的关联对象，并对该第一绘制过程描述数据进行解析处理，得到第一解析结果。

其中，第一绘制过程描述数据的关联对象用于表示在图表绘制展示模块中与该第一绘制过程描述数据相关的对象。

另外，本申请实施例不限定上述“第一绘制过程描述数据的关联对象”，例如，其具体可以为第一对象实例，以便后续图表绘制展示模块能够从该关联对象获知第一绘制过程描述数据是由图表库使用模块针对第一对象实例进行反馈的，以使该图表绘制展示模块能够使用该第一绘制过程描述数据参与第一对象实例的执行过程，以实现针对目标数据的图像绘制过程。

又如，上述“第一绘制过程描述数据的关联对象”也可以为目标数据，以便后续图表绘制展示模块能够从该关联对象获知第一绘制过程描述数据是由图表库使用模块针对目标数据进行反馈的，以使该图表绘制展示模块能够使用该第一绘制过程描述数据参与针对该目标数据所创建的第一对象实例的执行过程，以实现针对目标数据的图像绘制过程。

需要说明的是，步骤13中执行动作“对该第一绘制过程描述数据进行解析处理，得到第一解析结果”的相关内容请参见上文S13。

基于上述步骤13的相关内容可知，当图表绘制展示模块获取到由图表库使用模块针对图表描述信息反馈的第一绘制过程描述数据、以及该第一绘制过程描述数据的实例ID描述信息之后，该图表绘制展示模块不仅可以针对该第一绘制过程描述数据进行解析，得到第一解析结果，以使该第一解析结果能够描述出在图表绘制展示模块的真实画布上针对该目标数据的图表绘制过程，还可以从该实例ID描述信息中确定出该第一绘制过程描述数据是针对第一对象实例(或者目标数据)进行反馈的，以使该图表绘制展示模块能够确定出该第一解析结果应该参与到针对该目标数据所创建的第一对象实例的执行过程中，如此使得后续该图表绘制展示模块能够在该第一解析结果的基础上执行第一对象实例，以实现针对该目标数据的图标绘制。

步骤14：图表绘制展示模块按照第一解析结果、以及第一绘制过程描述数据的关联对象，绘制并展示目标数据的待展示图表。其中，待展示图表用于以图表方式展示目标数据。

本申请实施例中，在图表绘制展示模块获取到第一解析结果、以及第一绘制过程描述数据的关联对象之后，该图表绘制展示模块可以从该关联对象中获知该第一解析结果应该参与到针对该目标数据所创建的第一对象实例的执行过程中，故该图表绘制展示模块可以参考该第一解析结果执行该第一对象实例，以实现绘制并展示目标数据的待展示图表的目的，如此能够有效地避免因图表绘制展示模块弄混图表库使用模块的大量反馈数据而导致的不良影响，如此能够有效地提高图标绘制效果。

基于上述步骤11至步骤14的相关内容可知，在一些应用场景下，图表绘制展示模块与图表库使用模块之间不仅需要传输那些与图表绘制相关的信息(例如，图表需求信息、图表绘制过程数据等)，还需要传输那些用于保证图表反馈不发生混乱的信息(例如，对象实例ID等)，如此能够有效地避免因图表绘制展示模块弄混图表库使用模块的大量反馈数据而导致的不良影响，如此能够有效地提高图标绘制效果。

方法实施例三

实际上，当用户在图表绘制展示模块的用户界面上看到待展示图表之后，该用户可能想要针对该待展示图表提出一些额外要求(例如，特殊显示某个数据点、特殊显示某个数据区间、标记出某个数据点的详细信息等)。

为了实现上述用户需求，本申请实施例还提供了图表绘制方法的另一种可能的实施方式，在该实施方式中，该图表绘制方法除了包括上述S1-S4(或者步骤11-步骤14)以外，可以还包括S5-S8：

S5：在图表绘制展示模块获取到用户针对待展示图表的触发操作之后，该图表绘制展示模块获取该触发操作的事件描述信息。

其中，触发操作是指由用户在图表绘制展示模块的用户界面上针对待展示图表所触发的操作；而且本申请实施例不限定该触发操作，例如，当图表绘制展示模块是能够在电子设备上运行的应用程序，而且该电子设备包括触摸屏时，针对待展示图表的触发操作可以包括触碰操作(也就是，touch)。

上述“触发操作的事件描述信息”用于描述该触发操作所对应的事件。例如，如果针对待展示图表的触发操作为触碰操作，则该触发操作所对应的事件为touch事件(例如，图5所示的“触摸事件”等)，以使该触发操作的事件描述信息可以表示出一些与该touch事件相关的信息(例如，从该touch事件中提取出的关键信息)，从而使得该事件描述信息能够表示出与该触发操作所对应的事件。

另外，本申请实施例不限定上述“触发操作的事件描述信息”的获取过程，例如，其具体可以为：在图表绘制展示模块获取到用户针对待展示图表的触发操作之后，该图表绘制展示模块先从预先构建的预设映射关系中查询该触发操作对应的事件；再由该图表绘制展示模块，从该触发操作对应的事件中提取关键信息，作为该触发操作的事件描述信息，以使该事件描述信息能够表示出该触发操作所对应的事件。其中，预设映射关系用于记录大量候选操作所对应的事件。

基于上述S5的相关内容可知，当用户在图表绘制展示模块的用户界面上看到待展示图表之后，如果该用户想要针对该待展示图表提出一些新要求(例如，详细介绍某一数据点的相关内容、高亮显示某一个数据点或者数据区域、以另外一种图表类型展示目标数据等)，则该用户可以在该待展示图表上执行一些能够表达出该新要求的触发操作，以便在该图表绘制展示模块能够从该触发操作中获知用户需求，并从该触发操作对应的事件中确定出该触发操作的事件描述信息，以便后续该图表绘制展示模块能够借助该事件描述信息向图表库使用模块传达该用户需求。

S6：图表绘制展示模块将事件描述信息和待展示图表的图表标识发送给图表库使用模块。

其中，待展示图表的图表标识用于唯一表示该待展示图表；而且本申请实施例不限定该待展示图表的图表标识。

可见，本申请实施例中，在图表绘制展示模块获取到事件描述信息之后，该图表绘制展示模块可以将该事件描述信息发送给图表库使用模块，以使该图表库使用模块能够从该事件描述信息中了解到用户需求，以便该图表库使用模块能够基于该事件描述信息实现图表绘制处理。

另外，本申请实施例不限定上述“图表库使用模块能够基于该事件描述信息实现图表绘制处理”的实施方式，例如，其具体可以包括步骤31-步骤33(如图4所示)：

步骤31：图表库使用模块根据事件描述信息和待展示图表的图表标识，确定事件对象，以使该事件对象能够描述出在图表库使用模块针对上文“触发操作”所表征的用户需求所创建的任务。

本申请实施例中，在图表库使用模块获取到事件描述信息和待展示图表的图表标识之后，该图表库使用模块可以从该图表标识中获知需要针对待展示图表进行调整，并可以从该事件描述信息中获知需要针对该待展示图表进行哪些调整(例如，新增一些图表信息、更换一些图表信息等)，以使该图表库使用模块能够基于该事件描述信息以及该图表标识，重新组装出事件对象，以使该事件对象能够描述出在图表库使用模块针对上文“触发操作”所表征的用户需求所创建的任务，从而使得该事件对象能够按照该图表库使用模块所能理解的方式表达出该图表库使用模块应该针对该待展示图表进行哪些调整工作，进而使得该图表库使用模块能够从该事件对象中获知其应该针对该待展示图表执行那些调整操作。

步骤32：图表库使用模块通过调用待使用图表库的方式，执行事件对象，得到第二绘制过程描述数据，以使该第二绘制过程描述数据能够描述出在图表库使用模块中针对待展示图表的调整过程。

本申请实施例中，在图表库使用模块获取到事件对象之后，该图表库使用模块可以是在待使用图表库的基础上执行该事件对象，得到第二绘制过程描述数据，以使该第二绘制过程描述数据能够描述出在图表库使用模块中针对待展示图表的调整过程，从而使得该第二绘制过程描述数据能够描述出为了实现上述“触发操作”所表征的用户需求，应该针对该待展示图表执行哪些调整操作，以便后续该图表库使用模块能够借助该第二绘制过程描述数据向图表绘制展示模块传达针对该待展示图表所需执行的调整过程。

S7：在图表绘制展示模块获取到图表库使用模块针对事件描述信息和待展示图表的图表标识反馈的第二绘制过程描述数据之后，该图表绘制展示模块对第二绘制过程描述数据进行解析处理，得到第二解析结果。

其中，第二解析结果用于描述在真实画布上针对待展示图表的调整过程；而且本申请实施例不限定该第二解析结果的确定过程，例如，该第二解析结果的确定过程类似于上文“第二解析结果的确定过程”，为了简要起见，在此不再赘述。

基于上述S3的相关内容可知，当图表绘制展示模块获取到由图表库使用模块针对图表描述信息反馈的第二绘制过程描述数据之后，该图表绘制展示模块可以针对该第二绘制过程描述数据进行解析，得到第二解析结果，以使该第一解析结果能够描述出在图表绘制展示模块的真实画布上针对该待展示图表的调整过程，从而使得该图表绘制展示模块能够从该第二解析结果中了解到如何针对该待展示图表进行调整绘制，以便后续该图表绘制展示模块能够参考该第二解析结果实现针对该目标数据的调整绘制。

S8：图表绘制展示模块按照第二解析结果，绘制并展示触发操作的响应图表。其中，响应图表用于以图表形式满足用户针对待展示图表的调整需求。

本申请实施例中，因第二解析结果能够按照该图表绘制展示模块可以理解的方式表达出如何针对待展示图表进行调整绘制，使得在图表绘制展示模块获取到第二解析结果之后，该图表绘制展示模块可以按照第二解析结果，在该图表绘制展示模块的真实画布上针对该待展示图表进行调整绘制，并将调整绘制后的待展示图表展示给用户，以使该用户能够从该图表绘制展示模块的用户界面上看到该调整绘制后的待展示图表，从而使得该调整绘制后的待展示图表能够满足用户针对调整绘制前的待展示图表的调整需求，进而使得该待展示图表能够更符合用户需求，如此有利于提高用户图表绘制体验。

基于上述S5至S8的相关内容可知，对于图表绘制展示模块来说，该图表绘制展示模块不仅能够响应用户针对目标数据的图标绘制请求，还能够响应于用户针对正在展示的待展示图表的图表调整请求，以使该图表绘制展示模块能够尽可能地满足用户图表绘制需求，如此有利于进一步提高用户图表绘制体验。

基于上述方法实施例提供的图表绘制方法，本申请实施例还提供了一种图表绘制装置，下面结合附图进行解释和说明。

装置实施例

装置实施例提供的图表绘制装置的技术详情，请参照上述方法实施例。

参见图6，该图为本申请实施例提供的一种图表绘制装置的结构示意图。

本申请实施例提供的图表绘制装置600，包括：

信息生成单元601，用于在获取到用户针对目标数据触发的图表绘制请求之后，生成所述目标数据的图表描述信息；

第一发送单元602，用于将所述图表描述信息发送给图表库使用模块；

第一解析单元603，用于在获取到所述图表库使用模块针对所述图表描述信息反馈的第一绘制过程描述数据之后，对所述第一绘制过程描述数据进行解析处理，得到第一解析结果；其中，所述第一解析结果用于表示针对所述目标数据的图表绘制过程；

第一展示单元604，用于按照所述第一解析结果，绘制并展示所述目标数据的待展示图表。

在一种可能的实施方式中，所述图表库使用模块，用于利用待使用图表库在模拟画布上针对所述目标数据进行图表绘制，得到所述第一绘制过程描述数据。

在一种可能的实施方式中，所述图表绘制展示模块包括真实画布；所述真实画布的实现技术栈不同于所述模拟画布的实现技术栈。

在一种可能的实施方式中，所述图表绘制展示模块包括真实画布；所述第一解析结果用于描述在所述真实画布上针对所述目标数据的图表绘制过程。

在一种可能的实施方式中，所述图表绘制装置600还包括：

信息获取单元，用于在获取到所述用户针对所述待展示图表的触发操作之后，获取所述触发操作的事件描述信息；

第二发送单元，用于将所述事件描述信息和所述待展示图表的图表标识发送给所述图表库使用模块；

第二解析单元，用于在获取到所述图表库使用模块针对所述事件描述信息和所述待展示图表的图表标识反馈的第二绘制过程描述数据之后，对所述第二绘制过程描述数据进行解析处理，得到第二解析结果；

第二展示单元，用于按照所述第二解析结果，绘制并展示所述触发操作的响应图表。

基于上述图表绘制装置600的相关内容可知，对于本申请实施例提供的图表绘制装置600来说，当该图表绘制装置600获取到用户针对目标数据(例如，某个产品在2021年中每一天的日销售量等)触发的图表绘制请求之后，先由该图表绘制装置600生成该目标数据的图表描述信息，以使该图表描述信息能够描述出针对该目标数据的图表绘制需求(例如，以折线图形式表示出该目标数据等)；再由该图表绘制装置600将该图表描述信息发送给图表库使用模块，以使该图表库使用模块能够借助其所能调用的图表库(例如，基于JS语法的图表库)以及该图表描述信息，模拟出针对该目标数据的图表绘制过程，得到第一绘制过程描述数据，并由该图表库使用模块将该第一绘制过程描述数据发送给图表绘制装置600；然后，由该图表绘制装置600对第一绘制过程描述数据进行解析处理，得到第一解析结果，以使该第一解析结果能够表示针对目标数据的图表绘制过程(尤其是，该第一解析结果能够按照该图表绘制装置600所能理解的方式表示针对目标数据的图表绘制过程)；最后，由该图表绘制装置600按照该第一解析结果，绘制并展示该目标数据的待展示图表，以使该待展示图表能够满足该用户针对该目标数据的图表绘制需求，如此能够实现由用户利用图表绘制装置600进行图表绘制的目的。

可见，因图表绘制装置600是基于第一绘制过程描述数据所描述的图表绘制过程进行图表绘制的，而非通过直接调用图表库进行图表绘制的，使得该图表绘制装置600在进行图表绘制时无需考虑该图表绘制装置600所使用的技术栈是否与可调用该图表库的技术栈保持一致，从而使得无论该图表绘制装置600所使用的技术栈是什么，该图表绘制装置600都可以通过与该图表库使用模块之间的数据交互过程实现图表绘制过程，如此能够有效地解决因该图表绘制装置600所使用的技术栈(例如，Flutter技术栈)不同于可调用图表库的技术栈(例如，网页开发技术栈等)，而导致该图表绘制装置600无法直接调用该图表库这一问题，从而能够实现不同种类的APP(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)均可以调用同一个图表库的目的。

需要说明的是，本申请实施例不限定图表绘制装置600与上文“图表绘制展示模块”之间的关联关系，例如，图表绘制展示模块可以就是该图表绘制装置600。又如，图表绘制展示模块中部署有该图表绘制装置600。

基于上述方法实施例提供的图表绘制方法，本申请实施例还提供了一种图表绘制系统，下面结合附图进行解释和说明。

系统实施例

系统实施例提供的图表绘制系统的技术详情，请参照上述方法实施例。

参见图7，该图为本申请实施例提供的一种图表绘制系统的结构示意图。

本申请实施例提供的图表绘制系统700，包括：图表绘制展示模块701和图表库使用模块702；其中，所述图表绘制展示模块701用于执行本申请实施例提供的图表绘制方法的任一实施方式；所述图表库使用模块702用于利用待使用图表库针对所述图表绘制展示模块701提供的图表需求信息(例如，上文“目标数据的图表描述信息”；或者上文“触发操作的事件描述信息和待展示图表的图表标识”等)进行图表绘制，得到所述图表需求信息对应的图表绘制过程数据(例如，上文“第一绘制过程描述数据”，或者上文“第二绘制过程描述数据”等)，并将所述图表绘制过程数据反馈给所述图表绘制展示模块701。

为了便于理解，下面结合一些可能的实施方式进行说明。

在一种可能的实施方式中，所述图表绘制展示模块701，用于在获取到用户针对目标数据触发的图表绘制请求之后，生成所述目标数据的图表描述信息；

所述图表绘制展示模块701，还用于将所述图表描述信息发送给图表库使用模块702；

所述图表库使用模块702，用于利用待使用图表库针对所述图表绘制展示模块701提供的图表描述信息进行图表绘制，得到第一绘制过程描述数据，并将所述第一绘制过程描述数据反馈给所述图表绘制展示模块701。

所述图表绘制展示模块701，还用于在获取到所述图表库使用模块702针对所述图表描述信息反馈的第一绘制过程描述数据之后，对所述第一绘制过程描述数据进行解析处理，得到第一解析结果；其中，所述第一解析结果用于表示针对所述目标数据的图表绘制过程；

所述图表绘制展示模块701，还用于按照所述第一解析结果，绘制并展示所述目标数据的待展示图表。

在一种可能的实施方式中，所述图表库使用模块702，具体用于利用待使用图表库在模拟画布上针对所述目标数据进行图表绘制，得到所述第一绘制过程描述数据。

在一种可能的实施方式中，所述图表绘制展示模块701包括真实画布；所述真实画布的实现技术栈不同于所述模拟画布的实现技术栈。

在一种可能的实施方式中，所述图表绘制展示模块701包括真实画布；所述第一解析结果用于描述在所述真实画布上针对所述目标数据的图表绘制过程。

在一种可能的实施方式中，所述图表绘制展示模块701，还用于在获取到所述用户针对所述待展示图表的触发操作之后，获取所述触发操作的事件描述信息；

所述图表绘制展示模块701，还用于将所述事件描述信息和所述待展示图表的图表标识发送给所述图表库使用模块702；

所述图表库使用模块702，用于利用待使用图表库针对所述图表绘制展示模块701提供的所述事件描述信息和所述待展示图表的图表标识进行图表绘制，得到第二绘制过程描述数据，并将所述第二绘制过程描述数据反馈给所述图表绘制展示模块701。

所述图表绘制展示模块701，还用于在获取到所述图表库使用模块702针对所述事件描述信息和所述待展示图表的图表标识反馈的第二绘制过程描述数据之后，对所述第二绘制过程描述数据进行解析处理，得到第二解析结果；

所述图表绘制展示模块701，还用于按照所述第二解析结果，绘制并展示所述触发操作的响应图表。

在一种可能的实施方式中，所述图表绘制展示模块701与所述图表库使用模块702之间通过跨技术栈通信方式(例如，图3-图5所示的跨技术栈通信等)进行数据通信。

在一种可能的实施方式中，所述图表绘制展示模块701与所述图表库使用模块702之间通过同步跨技术栈通信方式进行数据通信。

在一种可能的实施方式中，所述图表绘制展示模块701与所述图表库使用模块702之间通过异步跨技术栈通信方式进行数据通信。

在一种可能的实施方式中，所述图表绘制展示模块701通过预先定义的原生API(例如，图5所示的“原生API”)获取所述用户提供的用户需求信息(例如，上文“针对目标数据触发的图表绘制请求”，或者上文“针对所述待展示图表的触发操作”等)。

在一种可能的实施方式中，所述图表绘制展示模块701可以是电子设备。

在一种可能的实施方式中，所述图表绘制展示模块701可以是能够在电子设备上运行的应用程序(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)。

基于上述图表绘制系统700的相关内容可知，对于本申请实施例提供的图表绘制系统700来说，该图表绘制系统700包括：图表绘制展示模块701和图表库使用模块702；而且该图表绘制系统700的工作原理如下：当该图表绘制展示模块701获取到用户针对目标数据(例如，某个产品在2021年中每一天的日销售量等)触发的图表绘制请求之后，先由该图表绘制展示模块701生成该目标数据的图表描述信息，以使该图表描述信息能够描述出针对该目标数据的图表绘制需求(例如，以折线图形式表示出该目标数据等)；再由该图表绘制展示模块701将该图表描述信息发送给图表库使用模块702，以使该图表库使用模块702能够借助其所能调用的图表库(例如，基于JS语法的图表库)以及该图表描述信息，模拟出针对该目标数据的图表绘制过程，得到第一绘制过程描述数据，并由该图表库使用模块702将该第一绘制过程描述数据发送给图表绘制展示模块701；然后，由该图表绘制展示模块701对第一绘制过程描述数据进行解析处理，得到第一解析结果，以使该第一解析结果能够表示针对目标数据的图表绘制过程(尤其是，该第一解析结果能够按照该图表绘制展示模块701所能理解的方式表示针对目标数据的图表绘制过程)；最后，由该图表绘制展示模块701按照该第一解析结果，绘制并展示该目标数据的待展示图表，以使该待展示图表能够满足该用户针对该目标数据的图表绘制需求，如此能够实现由用户利用图表绘制展示模块701进行图表绘制的目的。

可见，因图表绘制展示模块701是基于第一绘制过程描述数据所描述的图表绘制过程进行图表绘制的，而非通过直接调用图表库进行图表绘制的，使得该图表绘制展示模块701在进行图表绘制时无需考虑该图表绘制展示模块701所使用的技术栈是否与可调用该图表库的技术栈保持一致，从而使得无论该图表绘制展示模块701所使用的技术栈是什么，该图表绘制展示模块701都可以通过与该图表库使用模块702之间的数据交互过程实现图表绘制过程，如此能够有效地解决因该图表绘制展示模块701所使用的技术栈(例如，Flutter技术栈)不同于可调用图表库的技术栈(例如，网页开发技术栈等)，而导致该图表绘制展示模块701无法直接调用该图表库这一问题，从而能够实现不同种类的APP(例如，web、基于Android技术栈的APP、基于IOS技术栈的APP、或者基于Flutter技术栈的APP等)均可以调用同一个图表库的目的。

进一步地，本申请实施例还提供了一种设备，所述设备包括处理器以及存储器：

所述存储器用于存储计算机程序；

所述处理器用于根据所述计算机程序执行本申请实施例提供的图表绘制方法的任一实施方式。

进一步地，本申请实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质用于存储计算机程序，所述计算机程序用于执行本申请实施例提供的图表绘制方法的任一实施方式。

进一步地，本申请实施例还提供了一种计算机程序产品，所述计算机程序产品在终端设备上运行时，使得所述终端设备执行本申请实施例提供的图表绘制方法的任一实施方式。

应当理解，在本申请中，“至少一个(项)”是指一个或者多个，“多个”是指两个或两个以上。“和/或”，用于描述关联对象的关联关系，表示可以存在三种关系，例如，“A和/或B”可以表示：只存在A，只存在B以及同时存在A和B三种情况，其中A，B可以是单数或者复数。字符“/”一般表示前后关联对象是一种“或”的关系。“以下至少一项(个)”或其类似表达，是指这些项中的任意组合，包括单项(个)或复数项(个)的任意组合。例如，a，b或c中的至少一项(个)，可以表示：a，b，c，“a和b”，“a和c”，“b和c”，或“a和b和c”，其中a，b，c可以是单个，也可以是多个。

以上所述，仅是本发明的较佳实施例而已，并非对本发明作任何形式上的限制。虽然本发明已以较佳实施例揭露如上，然而并非用以限定本发明。任何熟悉本领域的技术人员，在不脱离本发明技术方案范围情况下，都可利用上述揭示的方法和技术内容对本发明技术方案做出许多可能的变动和修饰，或修改为等同变化的等效实施例。因此，凡是未脱离本发明技术方案的内容，依据本发明的技术实质对以上实施例所做的任何简单修改、等同变化及修饰，均仍属于本发明技术方案保护的范围内。

Claims (10)

1.一种图表绘制方法，其特征在于，应用于图表绘制展示模块，所述方法包括：

在获取到用户针对目标数据触发的图表绘制请求之后，生成所述目标数据的图表描述信息；

将所述图表描述信息发送给图表库使用模块；

在获取到所述图表库使用模块针对所述图表描述信息反馈的第一绘制过程描述数据之后，对所述第一绘制过程描述数据进行解析处理，得到第一解析结果；其中，所述第一解析结果用于表示针对所述目标数据的图表绘制过程；

按照所述第一解析结果，绘制并展示所述目标数据的待展示图表。

2.根据权利要求1所述的方法，其特征在于，所述图表库使用模块，用于利用待使用图表库在模拟画布上针对所述目标数据进行图表绘制，得到所述第一绘制过程描述数据。

3.根据权利要求2所述的方法，其特征在于，所述图表绘制展示模块包括真实画布；所述真实画布的实现技术栈不同于所述模拟画布的实现技术栈。

4.根据权利要求1所述的方法，其特征在于，所述图表绘制展示模块包括真实画布；

所述第一解析结果用于描述在所述真实画布上针对所述目标数据的图表绘制过程。

5.根据权利要求1-4任一项所述的方法，其特征在于，所述展示所述目标数据的待展示图表之后，所述方法还包括：

在获取到所述用户针对所述待展示图表的触发操作之后，获取所述触发操作的事件描述信息；

将所述事件描述信息和所述待展示图表的图表标识发送给所述图表库使用模块；

在获取到所述图表库使用模块针对所述事件描述信息和所述待展示图表的图表标识反馈的第二绘制过程描述数据之后，对所述第二绘制过程描述数据进行解析处理，得到第二解析结果；

按照所述第二解析结果，绘制并展示所述触发操作的响应图表。

6.一种图表绘制装置，其特征在于，包括：

信息生成单元，用于在获取到用户针对目标数据触发的图表绘制请求之后，生成所述目标数据的图表描述信息；

第一发送单元，用于将所述图表描述信息发送给图表库使用模块；

第一解析单元，用于在获取到所述图表库使用模块针对所述图表描述信息反馈的第一绘制过程描述数据之后，对所述第一绘制过程描述数据进行解析处理，得到第一解析结果；其中，所述第一解析结果用于表示针对所述目标数据的图表绘制过程；

第一展示单元，用于按照所述第一解析结果，绘制并展示所述目标数据的待展示图表。

7.一种图表绘制系统，其特征在于，包括图表绘制展示模块和图表库使用模块；其中，所述图表绘制展示模块用于执行权利要求1-6任一项所述的图表绘制方法；

所述图表库使用模块用于利用待使用图表库针对所述图表绘制展示模块提供的图表需求信息进行图表绘制，得到所述图表需求信息对应的图表绘制过程数据，并将所述图表绘制过程数据反馈给所述图表绘制展示模块。

8.一种设备，其特征在于，所述设备包括处理器以及存储器：

所述存储器用于存储计算机程序；

所述处理器用于根据所述计算机程序执行权利要求1-5中任一项所述的方法。

9.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质用于存储计算机程序，所述计算机程序用于执行权利要求1-5中任一项所述的方法。

10.一种计算机程序产品，其特征在于，所述计算机程序产品在终端设备上运行时，使得所述终端设备执行权利要求1-5中任一项所述的方法。

Images