一种基于WebGL的图形绘制方法、装置及系统制造方法及图纸

本申请公开了一种基于WebGL的图形绘制方法、装置及系统。该方法包括：服务器接收终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求；所述服务器解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集；所述服务器将所述图形绘制规则指令集以指令流形式发送给所述终端设备执行，以实现目标图形的绘制。通过该技术方案，可以解决图形绘制效率较低的问题，提高兼容性，扩展JS项目的应用范围。

【技术实现步骤摘要】
一种基于WebGL的图形绘制方法、装置及系统
本申请涉及计算机图形绘制
，尤其涉及一种基于WebGL的图形绘制方法、装置及系统。
技术介绍
在网络游戏、动画展现等应用场景中，终端设备需要进行大量的多维图形(比如2D图形或3D图形)的绘制工作。图形绘制的快慢在较大程度上决定终端设备上的各种应用、程序对用户操作的响应速度，进而影响到该应用或程序的用户使用量。为提高图形绘制效率，在不依赖于浏览器为载体的情况下，一般在终端设备上使用专门开发的运行器(RunTime)，如图1，运行器的核心组成部分包括JS解析引擎和C++引擎框架，前者用于对JS项目中的指令集进行识别、解析，后者用于调用封装的C语言函数对指令进行执行操作。运行器运行JS代码(JavaScript语言编写的代码)形成的JS项目时，由运行器的JS解析引擎对JS代码项目中的指令集进行解析，然后将解析后的各条指令以“压栈”方式推送到C++引擎框架中执行，再通过OpenGLES进行渲染，最终完成预定图形的绘制工作。在大多数情况下，上述方式能够在终端设备上顺利完成图形绘制工作，但是，基于终端设备的运算能力，JS项目的整体运行效率低下、资源消耗量较大，导致终端设备短时内发热量过大，尤其终端设备为iOS设备时，由于JIT功能被禁用，iOS设备执行JavaScript脚本的效率更为低下。此外，由于不同的终端设备本身的差异，导致JS项目的运行效率各不相同，制约着JS项目的广泛应用。
技术实现思路
本申请实施例提供一种基于WebGL的图形绘制方法和装置、系统，以提高或改善图形绘制的效率，减少发热量，促进JS项目的广泛应用。一方面，本申请实施例提供的基于WebGL的图形绘制方法，包括：服务器接收终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求；所述服务器解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集；所述服务器通过网络将所述图形绘制规则指令集以指令流形式发送给所述终端设备执行，以实现目标图形的绘制。另一方面，本申请实施例还提供另一种基于WebGL的图形绘制方法，该方法包括：终端设备通过网络向服务器发送对JS项目中的目标图形进行绘制的绘制请求；所述终端设备接收所述服务器通过网络以指令流形式发送的、解析所述绘制请求并执行与所述绘制请求对应的JS项目代码形成的、基于WebGL的图形绘制规则指令集；所述终端设备执行所述指令流，以实现目标图形的绘制。再一方面，本申请实施例提供基于WebGL的图形绘制装置，该装置位于服务器侧，其特征在于，包括请求接收单元、解析执行单元和指令发送单元，其中：请求接收单元，用于接收终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求；解析执行单元，用于解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集；指令发送单元，用于通过网络将所述图形绘制规则指令集以指令流形式发送给所述终端设备执行，以实现目标图形的绘制。又一方面，本申请实施例还提供另一种基于WebGL的图形绘制装置，所述装置位于终端设备侧，其特征在于，包括请求发送单元、指令接收单元和指令执行单元，其中：请求发送单元，用于通过网络向服务器发送对JS项目中的目标图形进行绘制的绘制请求；指令接收单元，用于接收所述服务器通过网络以指令流形式发送的、解析所述绘制请求并执行与所述绘制请求对应的JS项目代码形成的、基于WebGL的图形绘制规则指令集；指令执行单元，用于执行所述指令流，以实现目标图形的绘制。再一方面，本申请实施例提供的基于WebGL的图形绘制系统，包括：所述系统包括服务器和终端设备，所述服务器包括请求接收单元、解析执行单元和指令发送单元，其中：请求接收单元，用于接收终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求；解析执行单元，用于解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集；指令发送单元，用于通过网络将所述图形绘制规则指令集以指令流形式发送给所述终端设备执行，以实现目标图形的绘制；所述终端设备包括：请求发送单元、指令接收单元和指令执行单元，其中：请求发送单元，用于通过网络向服务器发送对JS项目中的目标图形进行绘制的绘制请求；指令接收单元，用于接收所述服务器通过网络以指令流形式发送的、解析所述绘制请求并执行与所述绘制请求对应的JS项目代码形成的、基于WebGL的图形绘制规则指令集；指令执行单元，用于执行所述指令流，以实现目标图形的绘制。又一方面，本申请实施例提供另一种基于WebGL的图形绘制系统，包括：存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述计算机程序被所述处理器执行时实现如上所述的方法的步骤。再一方面，本申请实施例提供一种计算机可读存储介质，所述计算机可读存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现如上所述的方法的步骤。本申请实施例采用的上述至少一个技术方案能够达到以下有益效果：本申请实施例提供的技术方案在服务器接收到终端设备发送的对JS项目中的目标图形进行绘制的绘制请求后，由服务器解析绘制请求，执行与绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集，然后再发送终端设备执行，完成目标图形的绘制。通过该技术方案，由于基于WebGL的图形绘制规则指令集是在服务器端形成的，服务器具有较强的运算能力，避免了终端设备的超负荷运行，减少其发热量，有利于提高用户体验和图形绘制效率。此外，由于在服务器上形成图形绘制规则指令，终端设备底层的C++引擎框架仅负责“无差别”的执行，平滑了不同终端设备的差异性，有利于JS项目在各种终端设备上的推广应用。附图说明此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：图1为Web引擎端与运行器的框架结构示意图；图2为本申请基于WebGL的图形绘制方法实施例的流程示意图；图3为本申请基于WebGL的图形绘制方法的一个实例的信令交互图；图4为本申请基于WebGL的图形绘制装置实施例的结构示意图；图5为本申请另一个基于WebGL的图形绘制装置实施例的结构示意图；图6为本申请基于WebGL的图形绘制系统实施例的结构示意图。具体实施方式在对本申请的各种实施例进行充分介绍之前，为便于理解，先对一些基本背景进行介绍。随着计算机技术的发展，人们对计算机信息处理的响应速度要求越来越高，尤其在一些实时应用场景之中，更是如此。比如，常见的网络对战型的实时性网络游戏，这些游戏通常涉及大量目标对象的动作、场景、角色、能力值、武器装备等的迅速变换，为更好呈现本文档来自技高网...

【技术保护点】
1.一种基于WebGL的图形绘制方法，其特征在于，包括：/n服务器接收终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求；/n所述服务器解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集；/n所述服务器通过网络将所述图形绘制规则指令集以指令流形式发送给所述终端设备执行，以实现目标图形的绘制。/n

【技术特征摘要】
1.一种基于WebGL的图形绘制方法，其特征在于，包括：
服务器接收终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求；
所述服务器解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集；
所述服务器通过网络将所述图形绘制规则指令集以指令流形式发送给所述终端设备执行，以实现目标图形的绘制。


2.根据权利要求1所述的方法，其特征在于，所述终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求，包括所述终端设备的用户对JS项目对应的应用进行操作的操作结果信息，则所述服务器解析所述绘制请求，执行与所述绘制请求对应的JS项目代码，形成基于WebGL的图形绘制规则指令集，包括：
所述服务器解析所述绘制请求，执行与所述操作结果信息对应的JS项目代码，形成基于WebGL的图形绘制规则指令集。


3.根据权利要求2所述的方法，其特征在于，所述终端设备的用户对JS项目对应的应用进行操作的操作结果信息，包括如下一项或多项信息：
对重力感应器的操作结果信息；
触摸事件信息；
用户账号信息；
用户状态信息。


4.根据权利要求1所述的方法，其特征在于，所述终端设备通过网络发送的对JS项目中的目标图形进行绘制的绘制请求的时长，小于等于第一预定时长；所述服务器通过网络将所述图形绘制规则指令集以指令流形式发送给所述终端设备的时长，小于等于第二预定时长。


5.根据权利要求4所述的方法，其特征在于，所述第一预定时长和/或第二预定时长根据所述终端设备的用户对所述图形绘制的时长的要求确定。


6.根据权利要求1至5中任何一项所述的方法，其特征在于，所述网络为5G网络，基于所述第一预定时长、第二预定时长确定的网络传输速度，大于等于5G网络的平均速度。


7.一种基于WebGL的图形绘制方法，其特征在于，包括：
终端设备通过网络向服务器发送对JS项目中的目标图形进行绘制的绘制请求；
所述终端设备接收所述服务器通过网络以指令流形式发送的、解析所述绘制请求并执行与所述绘制请求对应的JS项目代码形成的、基于WebGL的图形绘制规则指令集；
所述终端设备执行所述指令流，以实现目标图形的绘制。


8.根据权利要求7所述的方法，其特征在于，所述图形绘制规则指令集至少包含一条对寄存器进行操作的指令，所述寄存器为内存中的临时存储区域。


9.根据权利要求8所述的方法，其特征在于，所述图形绘制规则指令集包括所述图形绘制规则指令，以及作为所述图形绘制规则指令的参数的预定操作类型和操作对象；
所述终端设备执行所述指令流，以实现目标图形绘制，包括：
所述终端设备根据所述指令流中的指令以及所述预定操作类型对所述操作对象进行操作，以对所述目标图形进行绘制。


10.根据权利要求9所述的方法，其特征在于，当所述图形绘制规则指令为对寄存器进行操作的指令时，
所述操作对象包括操作对象索引和寄存器索引，则终端设备根据所述图形绘制规则指令以及所述预定操作类型对所述操作对象进行操作，包括：
所述终端设备根据所述操作对象索引从数据区中获取所述操作对象索引对应的操作数据，并写入到所述寄存器索引对应的寄存器内；
所述终端设备根据所述图形绘制规则指令按照所述预定操作类型对所述寄存器内的操作数据进行操作；
或者，所述操作对象包括寄存器索引，则所述终端设备根据所述图形绘制规则指令以及所述预定操作类型对所述操作对象进行操作，包括：
所述终端设备将预定...

【专利技术属性】
技术研发人员：谢成鸿，
申请(专利权)人：搜游网络科技北京有限公司，
类型：发明
国别省市：北京;11