CN110018812B - 一种图形绘制方法和装置 - Google Patents

一种图形绘制方法和装置 Download PDF

Info

Publication number
CN110018812B
CN110018812B CN201810014707.6A CN201810014707A CN110018812B CN 110018812 B CN110018812 B CN 110018812B CN 201810014707 A CN201810014707 A CN 201810014707A CN 110018812 B CN110018812 B CN 110018812B
Authority
CN
China
Prior art keywords
instruction set
graph
target
data
identifier
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201810014707.6A
Other languages
English (en)
Other versions
CN110018812A (zh
Inventor
谢成鸿
王亚伟
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Lanya Box Technology Co ltd
Original Assignee
Beijing Lanya Box Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Lanya Box Technology Co ltd filed Critical Beijing Lanya Box Technology Co ltd
Priority to CN201810014707.6A priority Critical patent/CN110018812B/zh
Publication of CN110018812A publication Critical patent/CN110018812A/zh
Application granted granted Critical
Publication of CN110018812B publication Critical patent/CN110018812B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/20Software design
    • G06F8/24Object-oriented
    • YGENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
    • Y02TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02DCLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
    • Y02D10/00Energy efficient computing, e.g. low power processors, power management or thermal management

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Image Generation (AREA)

Abstract

本申请公开了一种图形绘制方法和装置,该方法包括:接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;根据所述指令集中包含的多条指令,对所述目标图形进行绘制。这样,通过将多条指令整合为一个指令集,运行器中的JS引擎可以直接调用指令集进行图形绘制,相较于现有技术而言,由于JS引擎由调用多次指令进行图形绘制改为调用一次指令集进行图形绘制,因此,可以减少JS到C++代码的调用次数,提高运行器的运行效率。

Description

一种图形绘制方法和装置
技术领域
本申请涉及计算机技术领域,尤其涉及一种图形绘制方法和装置。
背景技术
在2D图形或3D图形的绘制中,为了提高运行效率,在不依赖于浏览器为载体的情况下,可以使用运行器(runtime)进行图形绘制。运行器可以基于原生应用开发(例如iOS、android原生框架)对JavaScript(以下简称JS)引擎进行封装,实现JS语言与C++语言的相互调用,并通过OpenGLES(OpenGL for Embedded Systems)进行画面显示。
通常,运行器中可以包含JS引擎和C++引擎框架,运行器在实现JS语言与C++语言的相互调用时,JS引擎可以对JS语言进行解析,将解析后的JS语言通过JS引擎中的引擎接口调用至C++引擎框架中以实现C++语言对JS语言的调用,同时,JS引擎也可以通过该引擎接口将C++语言调用至JS语言中,以实现JS语言与C++语言的相互调用。在实现JS语言与C++语言的相互调用后,可以通过OpenGLES进行渲染处理并显示画面。
在实际应用中,运行器在绘制图形时,JS引擎可以将用于绘制图形的WebGL指令(使用JS语言编写)进行解析并调用至C++的引擎框架来完成图形的绘制。然而,由于webGL指令特别底层,JS引擎往往需要调用多次WebGL指令才可以完成一次图形绘制。这样,由于JS引擎需要频繁调用WebGL指令才能完成一次图形绘制,导致JS引擎的效率比较低,运行器的运行效率比较低。
发明内容
本申请实施例提供一种图形绘制方法和装置,用于解决现有技术中运行器在绘制图形时,其内部的JS引擎的引擎接口需要频繁调用WebGL指令才能完成一次图形绘制,导致运行器的运行效率比较低的问题。
第一方面,提供了一种图形绘制方法,包括:
接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;
根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
第二方面,提供了一种图形绘制装置,包括:
接收单元,接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;
确定单元,根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;
绘制单元,根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
第三方面,提供了一种运行器,包括:存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序,所述计算机程序被所述处理器执行时实现如第一方面所述的方法的步骤。
第四方面,提供了一种计算机可读存储介质,其特征在于,所述计算机可读存储介质上存储有计算机程序,所述计算机程序被处理器执行时实现如第一方面所述的方法的步骤。
本申请实施例采用的上述至少一个技术方案能够达到以下有益效果:
本申请实施例提供的技术方案,运行器在进行图形绘制时,接收对目标图形的绘制请求,根据所述绘制请求中包含的图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令,根据所述指令集中包含的多条指令,对所述目标图形进行绘制。这样,通过将多条指令整合为一个指令集,运行器中的JS引擎可以直接调用指令集进行图形绘制,相较于现有技术而言,由于JS引擎由调用多次指令进行图形绘制改为调用一次指令集进行图形绘制,因此,可以减少JS到C++代码的调用次数,提高运行器的运行效率。
附图说明
此处所说明的附图用来提供对本申请的进一步理解,构成本申请的一部分,本申请的示意性实施例及其说明用于解释本申请,并不构成对本申请的不当限定。在附图中:
图1为本申请的一个实施例图形绘制方法的流程示意图;
图2为本申请的一个实施例图形绘制方法的示意图;
图3为本申请的一个实施例图形绘制方法的示意图;
图4为本申请的一个实施例图形绘制设备的结构示意图;
图5为本申请的一个实施例运行器的结构示意图。
具体实施方式
HTML5是一种HTML标准,可以通过canvas(画布)提供标准的绘图API,通过这些绘图API可以将Web画面展现更好的效果。另外,还可以通过WebGL(英文全称:Web GraphicsLibrary)绘图协议对显卡GPU进行控制,为HTML5Canvas提供硬件加速渲染,以提高2D或3D的显示效率和显示效果。
现有技术中,HTML5以及WebGL均使用JavaScript语言(以下简称JS语言)开发,在使用HTML5或WebGL绘制图形时,通常依托浏览器为载体。随着市场的需求,大部分应用需要打包成APP,即不再以浏览器为载体运行,此时就产生了运行器。
运行器可以基于原生应用开发对JS引擎进行封装,实现JS语言与C++语言的相互调用,并通过OpenGL ES进行画面显示。现有技术中,运行器的通用做法主要由两种,一种是对WebGL指令进行直接封装,另一种是对WebGL指令进行高级封装。但是,在实际应用中,上述两种做法得到的运行器都有一定的局限性,具体地:
对WebGL指令进行直接封装的方式,由于WebGL指令特别底层,在使用运行器绘制一张简单的图片时,往往需要调用多条(大于10条)WebGL指令。这样,由于调用的指令的条数比较多,导致通过JS引擎对JS语言和C++语言进行相互调用时效率比较低,严重影响运行器的运行效率和整体性能,从而影响用户体验。
在对WebGL指令进行高级封装的方式中,JS引擎不直接调用WebGL指令,而是通过在运行器中直接调用更高级的JS对象或方法。比如,提供类似于HTML的dom对象,提供图片、文字等接口。然而,虽然这种方式能减少大量的JS语言和C++语言的相互调用,但是,由于需要对象层提供明确的规则和限制,导致系统开放性和扩展性受影响,特别是针对3D游戏领域,由于3D游戏自定义功能比较多,对JS对象或方法的需求不明确,导致不可能设计出通用的运行器。
由此可见,现有的运行器普遍存在运行效率低、扩展性差的缺点。
为了解决上述问题,本申请实施例提供一种图形绘制方法和装置,该方法包括:接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
本申请实施例提供的技术方案,可以将用于绘制图形的多条WebGL指令整合为一个指令集,运行器在绘制图形时,运行器中的JS引擎可以直接调用指令集进行图形绘制,相较于现有技术而言,由于JS引擎由调用多次指令进行图形绘制改为调用一次指令集进行图形绘制,因此,可以减少JS到C++代码的调用次数,提高运行器的运行效率。
下面结合本申请具体实施例及相应的附图对本申请技术方案进行清楚、完整地描述。显然,所描述的实施例仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。
需要说明的是,本申请实施例提供的图形绘制方法可以由运行器实现,所述运行器中可以包含JS引擎、C++引擎框架以及OpenGLES,其中,JS引擎可以是开源的引擎,例如Google浏览器的JS引擎、苹果浏览器的JS引擎、火狐浏览器的JS引擎,C++引擎框架为原生开发框架,例如,iOS、android原生框架,OpenGLES可以用于对图形进行渲染和显示。
以下结合附图,详细说明本申请各实施例提供的技术方案。
图1为本申请的一个实施例图形绘制方法的流程示意图。所述方法如下所述。
步骤102:接收对目标图形的绘制请求。
在步骤102中,在对一帧应用(例如:游戏中的界面)中包含的其中一个目标图形进行绘制时,可以接收对所述目标图形的绘制请求,其中,所述绘制请求中可以包含所述目标图形的图形标识。
本申请实施例中,所述图形标识可以是用于区分所述目标图形的信息,例如目标图形的ID。
在接收到对目标图形的绘制请求后,可以执行步骤104。
步骤104:根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集。
在步骤104中,在接收到所述图形绘制请求后,可以根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,以便于根据所述指令集进行图形绘制。
本申请实施例中,所述指令集中可以包含用于绘制所述目标图形的多条指令,该多条指令具体可以是多条WebGL指令。
根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,可以包括:
根据所述图形绘制请求中包含的所述图形标识,从存储设备中查找与所述图形标识对应的指令集,所述存储设备中存储有不同的图形标识以及与不同的图形标识对应的指令集。
具体地,可以预先将用于绘制所述目标图形的多条指令整合成一个指令集,并将该指令集与所述目标图形的图形标识对应存储在存储设备中,这样,在接收到所述图形绘制请求后,可以根据所述图形标识在所述存储设备中查找与所述图形标识对应的指令集。
在本申请实施例中,为了便于对不同的目标图形进行绘制,可以按照上述记载的方法确定对不同的目标图形进行绘制的多个指令集,并将该多个指令集与目标图形的图形标识对应存储至所述存储设备中,这样,在绘制不同的目标图形时,可以从所述存储设备中查找得到与不同的目标图形的图形标识对应的指令集。
需要说明的是,所述存储设备可以是系统内存,也可以是运行器中用于存储数据的空间,这里不做具体限定。其中,针对运行器而言,所述存储设备中存储的指令集和图形标识可以在所述运行器中的JS引擎以及C++引擎框架之间数据共享。这样,在绘制所述目标图形时,由于所述目标图形对应的所述指令集在所述JS引擎和C++引擎框架中数据共享,因此,JS引擎可以只进行一次函数调用,即只调用一次接口,并告知C++引擎框架执行所述指令集便可完成图形绘制。
在步骤104中,在确定得到与所述图形标识对应的指令集后,可以执行步骤106。
步骤106:根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
在步骤106中,在确定得到与所述目标图形的图形标识对应的指令集后,可以根据所述指令集绘制得到所述目标图形。
在本申请提供的一个实施例中,所述指令集中可以包含图形数据,其中,所述图形数据可以用于与所述指令集中包含的多条指令相结合,共同绘制得到所述目标图形,例如,所述图形数据可以是目标图形的位置、大小等。在根据所述指令集中包含的多条指令,对所述目标图形进行绘制时,可以根据所述指令集中包含的多条指令以及所述图形数据,对所述目标图形进行绘制。
具体地,运行器在根据所述指令集中包含的多条指令以及图形数据绘制所述目标图形时,JS引擎可以只调用一次接口,告知C++引擎框架可以根据所述指令集绘制所述目标图形,此时,C++引擎框架可以直接从共享的所述存储设备中调用所述指令集,并根据所述指令集中包含的多条指令以及图形数据完成所述目标图形的绘制。由于JS引擎只需要一次调用就可以完成一次图形绘制,因此,可以有效提高运行器的运行效率。
在本实施例中,当JS引擎需要对指令集中的图形数据进行修改时,由于所述存储设备中存储的指令集在JS引擎以及C++引擎框架之间数据共享,因此,JS引擎可以直接修改所述指令集中的图形数据,无需进行其他操作,在绘制图形时,C++引擎框架可以直接使用修改后的指令集进行图形绘制,可以在指令集修改的情况下实现高效率绘图。
在本申请的另一个实施例中,考虑到在对所述指令集中包含的指令增加或删除时,需要为所述指令集重新分配存储空间。最重要的是在应用中,目标图形对应的指令集类型变化的频率非常低,但是该目标图形对应的数据区变化频率非常高(例如:游戏中的角色移动时,角色的坐标一直在变化,即该角色对应的数据区一直在变化,但是该角色对应的指令集却没有变化),因此,为了提高效率,以及减少所述指令集占用的存储空间,可以将所述指令集中包含的所述图形数据(比如:位置、大小)与所述指令集中包含的指令分离,即所述指令集中可以不包含所述图形数据,而是将所述指令集中的图形数据以数据区的形式与所述指令集对应存储。同时,为了便于将所述数据区中的图形数据与所述指令集相结合进而对目标图形进行绘制,所述指令集中可以包含数据标识,所述数据区中可以包含与所述数据标识对应的图形数据,这样,可以根据所述指令集中包含的所述数据标识从所述数据区中查找对应的图形数据,并根据查找的图形数据以及所述指令集绘制目标图形。
例如,指令集A中包含数据标识M,指令集A对应的数据区1中包含数据标识1到N对应的N个图形数据,其中N大于M,这样,可以根据数据标识M从数据区1中查找第M个图形数据,第M个图形数据可以与指令集A相结合绘制得到目标图形。
需要说明的是,由于所述指令集中可以包含多条指令,每一条指令可以包含图形数据,因此,所述指令集中包含的数据标识的个数可以是多个,与所述指令集对应的所述数据区中可以包含与每一个所述数据标识对应的图形数据。为了便于描述,本申请实施例可以以所述指令集中包含一个数据标识为例进行说明。
还需要说明的是,所述数据区可以存储至步骤104中记载的所述存储设备中,这样,所述数据区中包含的图形数据也可以在JS引擎以及C++引擎框架之间数据共享。
在本实施例中,针对一个所述指令集而言,所述指令集可以对应一个数据区,所述数据区与所述指令集结合可以用于绘制得到一个目标图形;此外,所述指令集也可以对应多个数据区,每一个所述数据区与所述指令集相结合后,可以用于绘制得到不同的目标图形,即多个不同的目标图形可以共同使用一个指令集进行目标图形的绘制,这样,由于多个目标图形可以根据同一个指令集绘制得到,因此,可以有效减少存储的指令集的个数,从而有效减少指令集对存储空间的占用。
例如,指令集A可以对应数据区1和数据区2,根据指令集A和数据区1中的图形数据,可以绘制得到目标图形A1,根据指令集A和数据区2中的图形数据,可以绘制得到目标图形A2。由于目标图形A1和A2均可以根据指令集A绘制得到,因此,可以减少指令集的个数,从而减少指令集占用的存储空间。
基于本实施例中指令集与数据区分开存储的设计,在根据所述指令集中包含的多条指令,对所述目标图形进行绘制时,可以包括:
从所述存储设备中查找与所述指令集对应的其中一个所述数据区;
根据所述指令集中包含的数据标识,从查找到的所述数据区中确定与所述数据标识对应的图形数据;
根据所述图形数据以及所述指令集中包含的多条指令,对所述目标图形进行绘制。
具体地,运行器中的JS引擎可以根据实际绘制需求确定与所述指令集对应的一个数据区,并通过一次接口调用告知C++引擎使用所述指令集以及所述数据区进行图形绘制,此时,C++引擎框架可以根据所述指令集中包含的数据标识,从所述存储设备中的所述数据区中查找与所述数据标识对应的图形数据,并将该图形数据与所述指令集中包含的多条指令相结合,最终可以绘制得到所述目标图形。
例如,JS引擎在确定用于绘制目标图形的指令集A后,根据实际绘制需求从所述存储设备中确定与指令集A对应的数据区1后,可以将指令集A以及数据区1通过调用一次接口告知C++引擎框架,此时,C++引擎框架可以根据指令集A中包含的数据标识M,从数据区1中查找到与数据标识M对应的图形数据x,C++引擎框架在确定指令集A以及对应的图形数据x后,可以将指令集A与图形数据x相结合进而绘制得到所述目标图形。
在本实施例中,考虑到所述目标图形在显示时可能存在多种不同的显示状态,因此,在将多条指令整合成指令集,并以此方法得到多个指令集后,还可根据所述目标图形不同的显示状态,将多个所述指令集进行分类,不同类型的所述指令集可以视为一个指令集模板,不同的指令集模板可以对应目标图形不同的显示状态。
在得到多个不同类型的指令集模板后,根据所述指令集中包含的多条指令,对所述目标图形进行绘制,可以包括:
当所述目标图形的显示状态发生变化时,确定与所述目标图形变化后的显示状态对应的指令集;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
具体地,基于多个不同类型的指令集模板,在绘制所述目标图形的过程中,若所述目标图形在前后两帧的显示状态发生变化,则可以根据变化后的显示状态确定与变化后的显示状态对应的指令集(即上述记载的所述指令集模板),进而根据该指令集对所述目标图形进行绘制,以得到不同显示状态的所述目标图形。其中,在根据不同的指令集模板绘制不同显示状态的所述目标图形时,使用的数据区可以保持不变。
例如,在绘制第一帧的目标图形时,所述目标图形是正常的显示状态,此时,可以根据该正常的显示状态对应的指令集A和数据区1绘制得到所述目标图形;在绘制第二帧的所述目标图形时,所述目标图形增加了缩放状态,那么,可以确定与缩放状态对应的指令集B,并根据指令集B以及数据区1绘制得到增加了缩放状态的所述目标图形。
这样,在所述目标图形的显示状态发生变化时,由于可以根据所述目标图形不同的显示状态随意切换不同的指令集,因此,可以提到图形绘制的效率,针对运行器而言,可以提高运行器的运行效率。
本申请实施例提供的技术方案,可以实现对一帧应用中的每一个目标图形进行绘制,其中,在对每一个目标图形进行绘制时,通过将多条指令整合为一个指令集,可以使得运行器中的JS引擎直接调用指令集进行图形绘制,相较于现有技术而言,由于JS引擎由调用多次指令进行图形绘制改为调用一次指令集进行图形绘制,因此,可以减少JS到C++代码的调用次数,提高运行器的运行效率。
在本申请的另一实施例中,基于上述步骤102至106记载的内容,在对应用中包含的多个所述目标图形进行绘制时,可以根据上述记载的方法确定与每一个所述目标图形对应的指令集,并根据确定的所述指令集完成对多个所述目标图形的绘制。然而,在实际应用中,如果一帧应用(例如:游戏中的界面)中包含的目标图形的个数比较多,例如5000或10000个,那么,在绘制多个所述目标图形时,针对多帧应用而言,每帧应用都需要循环遍历多个所述目标图形,导致图形绘制的效率比较低,运行器的运行效率低下。
为了解决上述问题,在绘制多帧连续的应用时,针对每一帧应用而言,可以建立所述应用中的多个所述目标图形的第一树形结构,其中,所述第一树形结构中可以包含多个节点,每一个所述节点可以分别对应其中一个所述目标图形。
若下一帧应用的第一树形结构中,只要父子级关系未发生变化则可以直接将上一帧应用中父子级关系未发生变化的节点对应的所述目标图形的绘制数据复制到下一帧应用的所述目标图形的绘制数据中,以便对下一帧所述应用中的所述目标图形进行绘制。因为采用上述记载的指令集和数据区分离方案以及指令集模板方案,因此,即使指令集标示类型和数据区发生变化(比如:位置、旋转、缩放),也可以直接将上一帧数据直接拷贝到下一帧数据中。这样,由于可以直接将上一帧应用中的一部分绘制数据直接复制到下一帧应用中,减少了循环遍历的次数,因此,可以减少绘制应用所需的时间,提高运行器的运行效率。
如图2所示,图2中第一树形结构包括节点A至K,节点A至K为一帧应用中包含的11个目标图形对应的节点,在绘制完成上一帧应用后,已知下一帧应用中节点B、D、E、F、G、G和I(图2中用灰色进行标记)的父子级关系没有发生变化,且节点B、D、E、F、G、G和I对应的目标图形的渲染类型也没有发生变化,则在绘制下一帧应用时,可以直接将上一帧中节点B、D、E、F、G、G和I的绘制数据直接复制到下一帧应用的绘制数据中,无需循环遍历节点B、D、E、F、G、G和I。
需要说明的是,上述记载的建立第一树形结构是针对运行器中的JS引擎而言,可以避免JS引擎循环便利多次应用中包含的目标图形,由于JS引擎对JS语言的解析执行效率比较低,通过在JS引擎中建立第一树形结构,可以有效提高运行器的运行效率。
在本申请提供的又一实施例中,基于上述JS引擎中建立的第一树形结构,还可以在运行器的C++引擎架构中建立相应的第二树形结构,以提高C++引擎架构对C++语言的执行效率。具体地:
在绘制连续多帧应用时(每一帧应用均包含多个目标图形),C++引擎架构可以针对包含多个目标图形的每一帧应用分别建立第二树形结构,所述第二树形结构中可以包含多个节点,每一个所述节点可以分别对应一帧应用中包含的其中一个所述目标图形。
需要说明的是,所述第二树形结构中的“第二”与所述第一树形结构中的“第一”只是为了便于区别在C++引擎框架以及在JS引擎中建立的树形结构,没有其他特殊含义,其中,所述第二树形结构可以与所述第一树形结构对等,即所述第二树形结构中包含的多个节点的连接方式可以与所述第一树形结构中包含的多个节点的连接方式相同。
在C++引擎架构中建立所述第二树形结构后,可以确定所述第二树形结构中包含的每一个节点对应的指令集。具体地,可以确定每一个节点对应的目标图形,根据所述目标图形的图形标识,通过上述步骤104以及106记载的内容,确定得到每一个所述目标图形对应的指令集,进而确定得到每一个节点对应的指令集。
在确定与每一个节点对应的指令集后,可以根据每一个所述节点对应的指令集,通过接口调用对应的指令集对每一个所述节点进行绘制,以对所述应用中包含的多个所述目标图形进行绘制。
需要说明的是,基于上述步骤104以及106记载的内容可知,所述指令集中可以包含图形数据,也可以不包含图形数据,这样,针对包含图形数据的指令集而言,可以通过上述记载的方法对所述第二树形结构中包含的每一个节点进行绘制,进而实现对应用的绘制。针对不包含图形数据的指令集而言,在确定每一个节点对应的指令集后,还需要进一步确定所述指令集对应的数据区,并通过接口调用对应的指令集以及数据区对每一个所述节点进行绘制,以对所述应用中包含的多个所述目标图形进行绘制。
这样,C++引擎框架在绘制连续多帧应用时,可以循环遍历每帧应用对应的所述第二树形结构,并将每个节点按照指令集或指令集以及数据区进行绘制,可以提高图形绘制效率,进而提高运行器的运行效率。
如图3所示,图3中第二树形结构包括节点A至E,节点A至E为一帧应用中包含的5个目标图形对应的节点,其中,已知节点a对应指令集A以及数据区1,节点b对应指令集B以及数据区2,节点c对应指令集C以及数据区3,节点d对应指令集C以及数据区4,节点e对应指令集B以及数据区5。这样,在绘制该帧应用时,可以按照每个节点对应的指令集以及数据区对每个节点进行绘制,进而对一帧应用进行绘制。由于每帧应用都可以建立一个树形结构,因此,每一帧应用都可以循环遍历树形结构,进而实现多个应用的绘制,有效提高运行器的运行效率。
需要说明的是,基于上述记载的图形绘制方法,为了便于运行器按照所述图形绘制方法对图形进行绘制,本申请实施例还提供了一些扩展指令或接口,具体包括:
在绘制3D图形时,可以包括webGL所有的标准API;在绘制2D图形时,可以采用HTML5-Canvas的标准API,运行器的底层通过openGL ES实现与HTML5-Canvas一样的显示效果,这样可以减少指令集的大小,从而提高效率并减少对内存的调用。
执行指令集:executeInstructionSet(instruction Set)、执行数据分离的指令集DS(Data Separate):executeDSInstructionSet(instruction Set,data)以及绘制节点指令集:drawNode(node)。
图4为本申请的一个实施例图形绘制装置的结构示意图。所述图形绘制装置包括:接收单元41、确定单元42和绘制单元43,其中:
接收单元41,接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;
确定单元42,根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;
绘制单元43,根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
可选地,所述确定单元42根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,包括:
根据所述图形绘制请求中包含的所述图形标识,从存储设备中查找与所述图形标识对应的指令集,所述存储设备中存储有不同的图形标识以及与不同的图形标识对应的指令集。
可选地,确定单元42确定的所述指令集中包含图形数据;
所述绘制单元43根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
根据所述指令集中包含的多条指令以及所述图形数据,对所述目标图形进行绘制。
可选地,所述确定单元42确定的所述指令集中包含图形数据的数据标识,所述存储设备中还存储有与所述指令集对应的一个或多个数据区,所述数据区中包含与所述数据标识对应的图形数据;
所述绘制单元43根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
从所述存储设备中查找与所述指令集对应的其中一个所述数据区;
根据所述指令集中包含的数据标识,从查找到的所述数据区中确定与所述数据标识对应的图形数据;
根据所述图形数据以及所述指令集中包含的多条指令,对所述目标图形进行绘制。
可选地,所述存储设备中存储有不同类型的所述指令集,不同类型的所述指令集对应所述目标图形的不同显示状态;
所述绘制单元43根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
当所述目标图形的显示状态发生变化时,确定与所述目标图形变化后的显示状态对应的指令集;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
可选地,所述绘制单元43在对应用中包含的多个所述目标图形进行绘制时,建立所述应用中的多个所述目标图形的第一树形结构,所述第一树形结构中包含多个节点,每一个所述节点分别对应其中一个所述目标图形;
若上一帧应用的所述第一树形结构中存在多个节点的父子级关系未发生变化,则将所述上一帧所述应用中父子级关系未发生变化的节点对应的所述目标图形的绘制数据复制到下一帧应用的所述目标图形的绘制数据中,以对所述下一帧应用中的所述目标图形进行绘制。
可选地,所述绘制单元43针对每一帧所述应用建立第二树形结构,所述第二树形结构中包含多个节点,每一个所述节点分别对应所述应用中包含的其中一个所述目标图形;
确定所述第二树形结构中包含的每一个节点对应的指令集;
根据每一个所述节点对应的指令集,对每一个所述节点进行绘制,以对所述应用中包含的多个所述目标图形进行绘制。
图5为本申请的一个实施例运行器的结构示意图,所述运行器50中包含存储器51、处理器52及存储在所述存储器51上并可在所述处理器52上运行的计算机程序,所述计算机程序被所述处理器52执行时实现上述记载的图形绘制方法的步骤。
本申请实施例还提供一种计算机可读存储介质,所述计算机可读存储介质上存储有计算机程序,所述计算机程序被处理器执行时实现上述记载的图形绘制方法的步骤。
本领域内的技术人员应明白,本申请的实施例可提供为方法、系统、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
在一个典型的配置中,计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。
内存可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。按照本文中的界定,计算机可读介质不包括暂存电脑可读媒体(transitory media),如调制的数据信号和载波。
还需要说明的是,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、商品或者设备中还存在另外的相同要素。
本领域技术人员应明白,本申请的实施例可提供为方法、系统或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
以上所述仅为本申请的实施例而已,并不用于限制本申请。对于本领域技术人员来说,本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等,均应包含在本申请的权利要求范围之内。

Claims (16)

1.一种图形绘制方法,其特征在于,包括:
接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;
根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;所述指令集与所述目标图形的图形标识对应存储在存储设备中,所述存储设备中存储的指令集和图形标识在运行器中的JS引擎和C++引擎框架之间数据共享;JS引擎对所述绘制请求进行解析并调用C++引擎框架;
C++引擎框架从共享的所述存储设备中调用所述指令集,根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
2.如权利要求1所述的方法,其特征在于,根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,包括:
根据所述图形绘制请求中包含的所述图形标识,从存储设备中查找与所述图形标识对应的指令集,所述存储设备中存储有不同的图形标识以及与不同的图形标识对应的指令集。
3.如权利要求2所述的方法,其特征在于,
所述指令集中包含图形数据;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
根据所述指令集中包含的多条指令以及所述图形数据,对所述目标图形进行绘制。
4.如权利要求2所述的方法,其特征在于,
所述指令集中包含图形数据的数据标识,所述存储设备中还存储有与所述指令集对应的一个或多个数据区,所述数据区中包含与所述数据标识对应的图形数据;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
从所述存储设备中查找与所述指令集对应的其中一个所述数据区;
根据所述指令集中包含的数据标识,从查找到的所述数据区中确定与所述数据标识对应的图形数据;
根据所述图形数据以及所述指令集中包含的多条指令,对所述目标图形进行绘制。
5.如权利要求2至4任一项所述的方法,其特征在于,
所述存储设备中存储有不同类型的所述指令集,不同类型的所述指令集对应所述目标图形的不同显示状态;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
当所述目标图形的显示状态发生变化时,确定与所述目标图形变化后的显示状态对应的指令集;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
6.如权利要求1所述的方法,其特征在于,所述方法还包括:
在对应用中包含的多个所述目标图形进行绘制时,建立所述应用中的多个所述目标图形的第一树形结构,所述第一树形结构中包含多个节点,每一个所述节点分别对应其中一个所述目标图形;
若上一帧应用的所述第一树形结构中存在多个节点的父子级关系未发生变化,则将所述上一帧所述应用中父子级关系未发生变化的节点对应的所述目标图形的绘制数据复制到下一帧应用的所述目标图形的绘制数据中,以对所述下一帧应用中的所述目标图形进行绘制。
7.如权利要求6所述的方法,其特征在于,所述方法还包括:
针对每一帧所述应用建立第二树形结构,所述第二树形结构中包含多个节点,每一个所述节点分别对应所述应用中包含的其中一个所述目标图形;
确定所述第二树形结构中包含的每一个节点对应的指令集;
根据每一个所述节点对应的指令集,对每一个所述节点进行绘制,以对所述应用中包含的多个所述目标图形进行绘制。
8.一种图形绘制装置,其特征在于,包括:
接收单元,接收对目标图形的绘制请求,所述绘制请求中包含所述目标图形的图形标识;
确定单元,根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,所述指令集中包含对所述目标图形进行绘制的多条指令;所述指令集与所述目标图形的图形标识对应存储在存储设备中,所述存储设备中存储的指令集和图形标识在运行器中的JS引擎和C++引擎框架之间数据共享;JS引擎对所述绘制请求进行解析并调用C++引擎框架;
绘制单元,根据C++引擎框架从共享的所述存储设备中调用的所述指令集中包含的多条指令,对所述目标图形进行绘制。
9.如权利要求8所述的装置,其特征在于,所述确定单元根据所述绘制请求中包含的所述图形标识,确定与所述图形标识对应的指令集,包括:
根据所述图形绘制请求中包含的所述图形标识,从存储设备中查找与所述图形标识对应的指令集,所述存储设备中存储有不同的图形标识以及与不同的图形标识对应的指令集。
10.如权利要求9所述的装置,其特征在于,
确定单元确定的所述指令集中包含图形数据;
所述绘制单元根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
根据所述指令集中包含的多条指令以及所述图形数据,对所述目标图形进行绘制。
11.如权利要求9所述的装置,其特征在于,
所述确定单元确定的所述指令集中包含图形数据的数据标识,所述存储设备中还存储有与所述指令集对应的一个或多个数据区,所述数据区中包含与所述数据标识对应的图形数据;
所述绘制单元根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
从所述存储设备中查找与所述指令集对应的其中一个所述数据区;
根据所述指令集中包含的数据标识,从查找到的所述数据区中确定与所述数据标识对应的图形数据;
根据所述图形数据以及所述指令集中包含的多条指令,对所述目标图形进行绘制。
12.如权利要求9至11任一项所述的装置,其特征在于,
所述存储设备中存储有不同类型的所述指令集,不同类型的所述指令集对应所述目标图形的不同显示状态;
所述绘制单元根据所述指令集中包含的多条指令,对所述目标图形进行绘制,包括:
当所述目标图形的显示状态发生变化时,确定与所述目标图形变化后的显示状态对应的指令集;
根据所述指令集中包含的多条指令,对所述目标图形进行绘制。
13.如权利要求8所述的装置,其特征在于,
所述绘制单元在对应用中包含的多个所述目标图形进行绘制时,建立所述应用中的多个所述目标图形的第一树形结构,所述第一树形结构中包含多个节点,每一个所述节点分别对应其中一个所述目标图形;
若上一帧应用的所述第一树形结构中存在多个节点的父子级关系未发生变化,则将所述上一帧所述应用中父子级关系未发生变化的节点对应的所述目标图形的绘制数据复制到下一帧应用的所述目标图形的绘制数据中,以对所述下一帧应用中的所述目标图形进行绘制。
14.如权利要求13所述的装置,其特征在于,
所述绘制单元针对每一帧所述应用建立第二树形结构,所述第二树形结构中包含多个节点,每一个所述节点分别对应所述应用中包含的其中一个所述目标图形;
确定所述第二树形结构中包含的每一个节点对应的指令集;
根据每一个所述节点对应的指令集,对每一个所述节点进行绘制,以对所述应用中包含的多个所述目标图形进行绘制。
15.一种运行器,其特征在于,包括:存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序,所述计算机程序被所述处理器执行时实现如权利要求1至7中任一项所述的方法的步骤。
16.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质上存储有计算机程序,所述计算机程序被处理器执行时实现如权利要求1至7中任一项所述的方法的步骤。
CN201810014707.6A 2018-01-08 2018-01-08 一种图形绘制方法和装置 Active CN110018812B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201810014707.6A CN110018812B (zh) 2018-01-08 2018-01-08 一种图形绘制方法和装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201810014707.6A CN110018812B (zh) 2018-01-08 2018-01-08 一种图形绘制方法和装置

Publications (2)

Publication Number Publication Date
CN110018812A CN110018812A (zh) 2019-07-16
CN110018812B true CN110018812B (zh) 2022-09-09

Family

ID=67187430

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201810014707.6A Active CN110018812B (zh) 2018-01-08 2018-01-08 一种图形绘制方法和装置

Country Status (1)

Country Link
CN (1) CN110018812B (zh)

Families Citing this family (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111240675B (zh) * 2020-01-10 2023-07-25 广发证券股份有限公司 一种基于Canvas API的多端绘图方法
CN111737618A (zh) * 2020-06-24 2020-10-02 广联达科技股份有限公司 用于Web端的矢量图显示方法、装置和计算机设备
CN112215920A (zh) * 2020-09-25 2021-01-12 武汉天喻聚联科技有限公司 个性化卡片展示和制作方法及设备

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102323882A (zh) * 2011-08-31 2012-01-18 北京华电万通科技有限公司 一种应用于Web3D的数据处理装置和方法
CN103677828A (zh) * 2013-12-10 2014-03-26 华为技术有限公司 一种图层绘制方法、绘图引擎及终端设备

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9459851B2 (en) * 2010-06-25 2016-10-04 International Business Machines Corporation Arranging binary code based on call graph partitioning

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102323882A (zh) * 2011-08-31 2012-01-18 北京华电万通科技有限公司 一种应用于Web3D的数据处理装置和方法
CN103677828A (zh) * 2013-12-10 2014-03-26 华为技术有限公司 一种图层绘制方法、绘图引擎及终端设备

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
OpenGL(八) 显示列表;-牧野-;《https://blog.csdn.net/dcrmg/article/details/53133112》;20161111;第1-4页 *
OpenGL学习笔记:显示列表;lcphoenix;《https://blog.csdn.net/lcphoenix/article/details/6630969》;20110725;第1页 *

Also Published As

Publication number Publication date
CN110018812A (zh) 2019-07-16

Similar Documents

Publication Publication Date Title
CN107729094B (zh) 一种用户界面渲染的方法及装置
KR102215766B1 (ko) 합성 화상을 생성하는 방법 및 장치
CN109192054B (zh) 一种地图区域合并的数据处理方法及装置
CN110018812B (zh) 一种图形绘制方法和装置
CN103853562B (zh) 一种视频帧渲染方法及装置
CN107656759B (zh) 一种用于用户界面的渲染方法和装置
CN106021421B (zh) 一种加速网页渲染的方法及装置
CN111408138B (zh) 基于游戏引擎的渲染方法、装置及电子设备
CN106569805B (zh) 一种画布存储、图形绘制方法和设备
CN110609677A (zh) 一种基于WebGL的图形绘制方法、装置及系统
CN106210724B (zh) 图片解码方法及装置
CN110727825A (zh) 动画播放的控制方法、装置、服务器和存储介质
CN110362298B (zh) 一种基于浏览器的目标对象绘制方法、装置和浏览器
CN109857964B (zh) 一种页面操作的热力图绘制方法、装置、存储介质及处理器
CN106648567B (zh) 数据获取方法及装置
CN110020291B (zh) 网页布局的处理方法及装置
CN112732252A (zh) 一种动态生成ui的方法、装置和电子设备
CN112579066A (zh) 图表展示方法、装置、存储介质及设备
CN110262798B (zh) 基于WebGL的图形绘制方法、装置、运行器及可读存储介质
CN106569816B (zh) 一种渲染方法及装置
CN110968810A (zh) 网页数据处理方法和装置
CN110968373A (zh) 一种页面切换的实现方法、装置、存储介质及处理器
CN106569799B (zh) 程序处理方法及其设备
CN111240676A (zh) 一种生成骨架屏的代码的方法及装置
CN110990162A (zh) 一种数据穿梭的处理方法及装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
CB02 Change of applicant information

Address after: 100094 1301, building 4, area 4, courtyard 81, Beiqing Road, Haidian District, Beijing

Applicant after: Beijing LANYA Box Technology Co.,Ltd.

Address before: 100097 Room 303, 3rd floor, building 1, No. 25, lantianchang South Road, Haidian District, Beijing

Applicant before: SOUYOU NETWORK TECHNOLOGY (BEIJING) Co.,Ltd.

CB02 Change of applicant information
CB03 Change of inventor or designer information

Inventor after: Xie Chenghong

Inventor after: Wang Yawei

Inventor before: Xie Chenghong

CB03 Change of inventor or designer information
GR01 Patent grant
GR01 Patent grant