CN111476870A - 一种对象渲染方法和装置 - Google Patents

一种对象渲染方法和装置 Download PDF

Info

Publication number
CN111476870A
CN111476870A CN202010132731.7A CN202010132731A CN111476870A CN 111476870 A CN111476870 A CN 111476870A CN 202010132731 A CN202010132731 A CN 202010132731A CN 111476870 A CN111476870 A CN 111476870A
Authority
CN
China
Prior art keywords
rendering
rendering object
rotation track
rotation
determining
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.)
Granted
Application number
CN202010132731.7A
Other languages
English (en)
Other versions
CN111476870B (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.)
New H3C Big Data Technologies Co Ltd
Original Assignee
New H3C Big Data Technologies 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 New H3C Big Data Technologies Co Ltd filed Critical New H3C Big Data Technologies Co Ltd
Priority to CN202010132731.7A priority Critical patent/CN111476870B/zh
Publication of CN111476870A publication Critical patent/CN111476870A/zh
Application granted granted Critical
Publication of CN111476870B publication Critical patent/CN111476870B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T13/00Animation
    • G06T13/203D [Three Dimensional] animation
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T15/003D [Three Dimensional] image rendering
    • G06T15/005General purpose rendering architectures

Landscapes

  • Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Theoretical Computer Science (AREA)
  • Computer Graphics (AREA)
  • Processing Or Creating Images (AREA)

Abstract

本申请提供了一种对象渲染方法和装置,所述方法包括:获取包括渲染对象的二维图像,并依据所述渲染对象的渲染需求确定所述渲染对象的旋转轨道;基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,所述层叠顺序用于表征所述渲染对象在叠加顺序上的上下立体关系;根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示。由于本申请直接利用二维图像转换成三维动画进行渲染展示,并没有采用现有技术中的三维动画框架进行三维动画展示,降低了设备的硬件要求,且能够流畅地展示三维动画。

Description

一种对象渲染方法和装置
技术领域
本申请涉及数据处理领域,特别涉及一种对象渲染方法和装置。
背景技术
随着大数据技术的发展,人们对日常生活中数据的关注度日益提升,如何更加直观地展示海量数据成了大数据技术发展亟待解决的问题之一。为了解决这个问题,数据可视化技术应运而生。数据可视化是将大型数据以图形图像的形式表示,以便为人们提供更加直观的数据观看方式。同时,随着人们对数据展示需求的提高,单纯的二维场景展示已经不能满足人们需求,因此,基于三维场景的展示发展逐渐迅速。目前,基于前端技术的三维场景展示技术发展迅速,且种类较多。包括Babylon.js、Three.js等WebGL三维框架,这些框架为三维数据的展示提供了方便且多样的解决方案。同时,在数据可视化中,单纯的静态展示已经远远不能满足人们的需求,动画的加入使得数据可视化展示更加丰富多彩,使得可视化展示能够在多个方案中脱颖而出,吸引人的视线。
现有技术在进行三维动画展示时,是直接利用三维框架WebGL来实现的,即通过硬件加载3D加速渲染,以借助系统显卡在浏览器里展示3D场景和模型,这样不仅对设备本身的性能要求较高而且会导致耗费较多的硬件资源;此外,通过硬件资源展示会影响动画效果的流畅性,用户体验极差。
因此,如何在性能不高的设备上流畅地展示三维动画是值得考虑的问题之一。
发明内容
有鉴于此,本申请提供了一种对象渲染方法和装置,用以在不要求硬件设备的性能时,在性能不高的设备上流畅地展示三维动画。
具体地,本申请是通过如下技术方案实现的:
根据本申请的第一方面,提供一种对象渲染方法,包括:
获取包括渲染对象的二维图像,并依据所述渲染对象的渲染需求确定所述渲染对象的旋转轨道;
基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,所述层叠顺序用于表征所述渲染对象在叠加顺序上的上下立体关系;
根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示。
可选地,基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度,包括:
调用子线程,以使子线程基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序。
可选地,所述渲染需求包括所述旋转轨道的轨道参数;则
基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,包括:
基于所述旋转轨道的中心点的位置和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度;
基于所述轨道参数和所述旋转角度,确定所述渲染对象的目标位置;
根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序。
可选地,根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序,包括:
若基于所述旋转角度,确定所述渲染对象接近视点,则调大所述渲染对象的缩放程度,以放大所述渲染对象,以及增大所述渲染对象的层叠顺序值;
若基于所述旋转角度,确定所述渲染对象远离视点,则调小所述渲染对象的缩放程度,以缩小所述渲染对象,以及减少所述渲染对象的层叠顺序值。
可选地,根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示,包括:
根据所述渲染对象的目标位置、缩放程度和层叠顺序,通过层叠样式表CSS对所述渲染对象进行三维渲染及展示。
根据本申请的第二方面,提供一种对象渲染装置,包括:
获取模块,用于获取包括渲染对象的二维图像,并依据所述渲染对象的渲染需求确定所述渲染对象的旋转轨道;
确定模块,用于基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,所述层叠顺序用于表征所述渲染对象在叠加顺序上的上下立体关系;
渲染模块,用于根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示。
可选地,所述确定模块,具体用于调用子线程,以使子线程基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序。
可选地,所述渲染需求包括所述旋转轨道的轨道参数;则
所述确定模块,具体用于基于所述旋转轨道的中心点的位置和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度;基于所述轨道参数和所述旋转角度,确定所述渲染对象的目标位置;根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序。
可选地,所述确定模块,具体用于若基于所述旋转角度,确定所述渲染对象接近视点,则调大所述渲染对象的缩放程度,以放大所述渲染对象,以及增大所述渲染对象的层叠顺序值;若基于所述旋转角度,确定所述渲染对象远离视点,则调小所述渲染对象的缩放程度,以缩小所述渲染对象,以及减少所述渲染对象的层叠顺序值。
可选地,所述渲染模块,具体用于根据所述渲染对象的目标位置、缩放程度和层叠顺序,通过层叠样式表CSS对所述渲染对象进行三维渲染及展示。
根据本申请的第三方面,提供一种电子设备,包括处理器和机器可读存储介质,机器可读存储介质存储有能够被处理器执行的机器可执行指令,处理器被机器可执行指令促使执行本申请实施例第一方面所提供的方法。
根据本申请的第四方面,提供一种机器可读存储介质,机器可读存储介质存储有机器可执行指令,在被处理器调用和执行时,机器可执行指令促使处理器执行本申请实施例第一方面所提供的方法。
本申请实施例的有益效果:
本申请实施例提供的对象渲染方法,在获取到包括渲染对象的二维图像后,依据该渲染对象的渲染需求确定该渲染对象的旋转轨道,然后基于该旋转轨道和该渲染对象在旋转轨道的初始位置,确定该渲染对象按照旋转轨道移动的目标位置,以及移动时渲染对象的缩放程度和层叠顺序,进而基于确定出的目标位置、缩放程度和层叠顺序对该渲染对象进行三维渲染,由此直接对二维图像中的渲染对象进行处理,实现了流畅且真实的三维动画渲染效果,也即基于二维图像达到了模拟三维展示的效果,这样就避免使用现有技术中的三维框架,从而降低了硬件设备的要求且避免了资源的浪费。
附图说明
图1是本申请一示例性实施例示出的一种电子设备的结构示意图;
图2是本申请一示例性实施例示出的一种对象渲染方法的流程图;
图3是本申请一示例性实施例示出的一种旋转轨道示意图;
图4是本申请一示例性实施例示出的确定渲染对象的目标位置、缩放程度和层叠顺序的流程图;
图5是本申请一示例性实施例示出的一种对象渲染装置的框图。
具体实施方式
这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本申请相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本申请的一些方面相一致的装置和方法的例子。
在本申请使用的术语是仅仅出于描述特定实施例的目的,而非旨在限制本申请。在本申请和所附权利要求书中所使用的单数形式的“一种”、“所述”和“该”也旨在包括多数形式,除非上下文清楚地表示其他含义。还应当理解,本文中使用的术语“和/或”是指并包含一个或多个相对应的列出项目的任何或所有可能组合。
应当理解,尽管在本申请可能采用术语第一、第二、第三等来描述各种信息,但这些信息不应限于这些术语。这些术语仅用来将同一类型的信息彼此区分开。例如,在不脱离本申请范围的情况下,第一信息也可以被称为第二信息,类似地,第二信息也可以被称为第一信息。取决于语境,如在此所使用的词语“如果”可以被解释成为“在……时”或“当……时”或“响应于确定”。
现有技术中进行三维动画展示时,直接采用三维动画框架对展示设备的硬件性能要求较高,否则会导致动画卡顿,用户体验极差。
为了解决上述问题,本申请实施例提供一种对象渲染方法,应用于电子设备中,在获取到包括渲染对象的二维图像后,可以依据渲染对象的渲染需求确定该渲染对象的旋转轨道;基于上述旋转轨道和该渲染对象在上述旋转轨道的初始位置,确定该渲染对象按照上述旋转轨道移动的目标位置,以及确定该渲染对象的缩放程度和层叠顺序;然后根据确定出的该渲染对象的目标位置、缩放程度和层叠顺序对该渲染对象进行三维渲染及展示。由于本申请直接利用二维图像转换成三维动画进行渲染展示,并没有采用现有技术中的三维动画框架进行三维动画展示,这样本申请的展示方法对电子设备的硬件性能没有较高的要求,即使硬件性能一般的电子设备采用本申请提供的方法也可以流畅地展示三维动画,提高了用户体验。
请参照图1,是本实施例提供的电子设备100的方框示意图。该电子设备100包括存储器110、处理器120及通信模块130。存储器110、处理器120以及通信模块130各元件相互之间直接或间接地电性连接,以实现数据的传输或交互。例如,这些元件相互之间可通过一条或多条通讯总线或信号线实现电性连接。
其中,存储器110用于存储程序或者数据。存储器110可以是,但不限于,随机存取存储器(Random Access Memory,RAM),只读存储器(Read Only Memory,ROM),可编程只读存储器(Programmable Read-Only Memory,PROM),可擦除只读存储器(ErasableProgrammable Read-Only Memory,EPROM),电可擦除只读存储器(Electric ErasableProgrammable Read-Only Memory,EEPROM)等。
处理器120用于读/写存储器110中存储的数据或程序,并执行相应地功能。例如,当存储器110存储的计算机程序被处理器120执行时,能够实现本申请各实施例所揭示的对象渲染方法。
通信模块130用于通过网络建立电子设备100与其它通信终端之间的通信连接,并用于通过网络收发数据。例如,电子设备100可以通过通信模块130从其它通信终端获取包括渲染对象的二维图像。
应当理解的是,图1所示的结构仅为电子设备100的结构示意图,电子设备100还可包括比图1中所示更多或者更少的组件,或者具有与图1所示不同的配置。图1中所示的各组件可以采用硬件、软件或其组合实现。可选地,本申请实施例中的电子设备100可以为便携式计算机、PC机等能够拥有三维动画展示的设备,当然也可以为其他设备,具体根据实际情况而定。
下面对本申请提供的对象渲染方法进行详细地说明。
参见图2,图2是本申请示出的一种对象渲染方法的流程图。该对象渲染方法应用于电子设备中,电子设备实施该方法时,可包括如下所示步骤:
S201、获取包括渲染对象的二维图像,并依据渲染对象的渲染需求确定渲染对象的旋转轨道。
具体实施时,本申请中的二维图像可以为UI设计图像,该二维图像包括展示时需要渲染的对象,即渲染对象,也称二维图像需要进行三维动画展示的物体。
此外,当二维图像生成好后,其内渲染对象的动画展示需求(可视化需求)即可确定,故在获取二维图像的同时能够获取到二维图像中渲染对象的渲染需求,例如,各个时刻展示在何位置、在该位置处以何种大小进行展示等等。基于渲染对象的渲染需求可以确定渲染对象的旋转轨道。需要说明的是,本申请二维图像中包括至少一个渲染对象,当包括多个渲染对象时,多个渲染对象的旋转轨道可以相同也可以不同,具体可以根据实际情况而定。为了描述方便,本申请以二维图像中的渲染对象均对应一个旋转轨道为例进行说明。
值得注意的是,本申请中的旋转轨道可以理解为:二维图像中的渲染对象围绕某一中心分布在椭圆或者圆形等的轨道旋转。
S202、基于旋转轨道和渲染对象在旋转轨道的初始位置,确定渲染对象按照旋转轨道移动的目标位置,以及确定渲染对象的缩放程度和层叠顺序。
本申请中的层叠顺序用于表征渲染对象在叠加顺序上的上下立体关系。
具体实施时,实际应用中,按相同轨迹移动的渲染对象,在UI设计图中这些渲染对象是落在旋转轨道上的,为了能够进行三维动画展示,需要确定渲染对象在旋转轨道上的初始位置,这样才能确定按照旋转轨道移动时的下一位置,即步骤S202中的目标位置,需要说明的是,本申请中的初始位置、目标位置是指渲染对象在三维动画展示时的展示位置。例如,当利用层叠样式表(Cascading Style Sheets,CSS)对渲染对象进行三维展示时,初始位置及目标位置是指渲染对象在CSS里的位置。
此外,为了实现三维动画展示,本申请实施例会定时或实时的对渲染对象的位置进行更新,故本申请中的目标位置可以理解为以当前时刻的初始位置为基准确定出的下一时刻的位置。
具体地,本申请中渲染对象的渲染需求包括旋转轨道的轨道参数,当以渲染对象的旋转轨道为椭圆时,旋转轨道的轨道参数为旋转轨道的半长轴a和半短轴b,若旋转轨道为圆型轨道,则半长轴等于半短轴,即a=b。在可视化的三维动画中,一般是若干个渲染对象(可能比较小)围绕中心渲染对象进行旋转,将中心渲染对象的位置设置为(X0,Y0),参考图3所示的椭圆型旋转轨道,(X0,Y0)即为椭圆轨道的中心点,为了能够实现三维动画展示,将围绕该椭圆轨道进行移动的渲染对象放置在椭圆轨道上,即需要确定渲染对象按照椭圆轨道进行移动时的目标位置。
可选地,基于上述任一实施例,可以按照图4所示的流程实施步骤S202,包括以下步骤:
S401、基于旋转轨道的中心点的位置和渲染对象在旋转轨道的初始位置,确定渲染对象的旋转角度。
需要说明的是,步骤S401确定出的旋转角度为渲染对象下一时刻移动时在目标位置处的旋转角度。
具体实施时,当渲染对象有多个时,可以根据渲染对象的个数确定各个渲染对象在旋转轨道的初始位置。例如,用横坐标和纵坐标来表示渲染对象的位置,则将第i个渲染对象的初始位置标记为(Xi,Yi)。在确定第i个旋转对象的初始位置时,先确定该渲染对象的初始旋转角度,记为θi,其为渲染对象的初始坐标与中心点的坐标连线与长轴之间的夹角,然后基于初始旋转角度确定初始位置;当确定各个渲染对象的初始旋转角度时,可以基于各个渲染对象在旋转轨道上的分布情况来确定,基于此原理可以计算得到渲染对象的初始旋转角度。需要说明的是,本申请中的初始旋转角度可以理解为当前时刻渲染对象所在位置(初始位置)的角度。
可选地,为了使得三维渲染画面获得更好的展示效果,本申请可以将各个渲染对象均匀分布,则各个渲染对象的初始旋转角度之间的关系可以用下述公式表示:
θii-1=2*π/N
上述公式中,N为渲染对象的个数,θi为第i个渲染对象的初始旋转角度,θi-1为第i-1个渲染对象的初始旋转角度。然后基于此先确定第i个渲染对象在当前初始旋转角度下的初始位置。
当定时刷新时,由于渲染对象是按照旋转轨道移动的,故渲染对象的渲染角度会发生变化,具体可以按照下述过程确定下一时刻渲染对象的旋转角度:该旋转角度的数值是通过当前时刻的初始旋转角度与固定的偏移量Δθ的和值,表示为:θi+Δθ。而偏移量Δθ可以由下述公式计算得到:
Figure BDA0002396241640000091
其中,T为旋转周期,n为定时器间隔。
S402、基于轨道参数和旋转角度,确定渲染对象的目标位置。
具体实施时,还以图3所示的椭圆轨道为例进行说明,该椭圆轨道的轨道参数为长半轴a和短半轴b,以计算第i个渲染对象的目标位置为例进行说明,基于步骤S401确定出第i个渲染对象的旋转角度为
Figure BDA0002396241640000092
则可以按照下述公式计算得到渲染对象的目标位置:
Figure BDA0002396241640000093
其中,公式中(x,y)为第i个渲染对象的目标位置,即需要选择到的位置。基于上述公式即可确定出各个时刻,渲染对象的目标位置。
S403、根据旋转角度,调节渲染对象的缩放程度和层叠顺序。
具体实施时,渲染对象的缩放程度和层叠顺序由旋转角度而定。其中,层叠顺序用于表征渲染对象在展示时的立体关系,在图像中也可以称作景深,也可以理解为第三维坐标,记为z-index。在三维空间中,同样大小的物体呈现近大远小的效果,基于此原理,展现在视点处的渲染对象应该大一些,而远离视点的渲染对象则小一些。
可选地,基于上述任一实施例,可以按照下述过程调节渲染对象的缩放程度和层叠顺序:
若基于旋转角度,确定渲染对象接近视点,则调大渲染对象的缩放程度,以放大渲染对象,以及增大渲染对象的层叠顺序值;
若基于旋转角度,确定渲染对象远离视点,则调小渲染对象的缩放程度,以缩小渲染对象,以及减少渲染对象的层叠顺序值。
需要说明的是,本申请实施例中的视点可以理解为人眼在观看三维动画时的,视角和视觉效果最好的点。
具体地,还结合图3进行说明,椭圆轨道上A0点视为离视点最近的点。则当第i个渲染对象的旋转角度
Figure BDA0002396241640000101
时,表明该渲染对象距离视点最远,相应的,该渲染对象的大小(展示大小)最小,故此时可以调小该渲染对象的缩放程度,以缩小渲染对象,以提高三维动画的展现效果。而当
Figure BDA0002396241640000102
时,即位于图3中旋转轨道的A0点时,此时该渲染对象距离视点最近,该渲染对象的大小应该最大,故此时可以通过调大该渲染对象的缩放程度,以放大该渲染对象。具体实施时,调大或调小渲染对象的缩放程度时,以使调整后的渲染对象的三维动画展示效果较佳为原则。
可选地,为了获得较好的展示效果,预先设定椭圆轨道上各个旋转角度对应的缩放程度,当确定第i个渲染对象的旋转角度后,基于旋转角度与缩放程度的对应关系,可以直接确定出该渲染对象的缩放程度。本申请实施例通过调整渲染对象的大小,实现近大远小的效果,使得实现的三维展示效果更接近于现实中的三维场景。
可选地,在进行三维展示时,很可能存在多个渲染对象,基于这种场景会同时存在距离视点近的渲染对象,以及距离视点远的渲染对象,可能会存在距离视点近的渲染对象遮挡距离视点远的渲染对象,在遮挡时,遮挡效果会不太好,即距离视点近的渲染对象不能较好地遮挡距离视点远的渲染对象,进而影响三维动画播放效果,故为了能够解决这一问题,本申请提出通过调节渲染对象的层叠顺序来实现。具体实施时,若渲染对象距离视点较近,则增大该渲染对象的层叠顺序值,即增大该渲染对象的z-index值;若渲染对象距离视点较远,则减少该渲染对象的层叠顺序值,即调小该渲染对象的z-index值。
还请参考图3所示,当渲染对象距离视点最近较近时,如处于视点位置的渲染对象,通过调大该渲染对象的层叠顺序值z-index,使得调整后的渲染对象能够遮挡距离视点较远的渲染对象,如遮挡视点的对称点等其他距离视点较远的位置处的渲染对象。相应地,距离视点较远的渲染对象,则通过减小距离视点较远的渲染对象的层叠顺序值z-index,这样使得距离视点较近的渲染对象能够更好地遮挡距离视点较远的旋转对象,从而达到较好的三维展示效果。基于此,通过调整旋转轨道上的渲染对象的层叠顺序值z-index,呈现出现实中的近大远小以及相互遮盖的效果,进而使得展示出的三维渲染动画更接近于实际的三维效果。
S203、根据渲染对象的目标位置、缩放程度和层叠顺序对渲染对象进行三维渲染及展示。
具体地,在确定出渲染对象的目标位置、缩放程度和层叠顺序后,对该渲染对象进行三维渲染展示时,可以通过层叠样式表CSS实现。具体实施时,通过CSS将渲染对象当前的位置、缩放程度和层叠顺序修改为基于步骤S202确定出的目标位置、缩放程度和层叠顺序,即可实现修改渲染对象的样式,也即实现该渲染对象的三维渲染。由于渲染对象的上述三个值是定时或实时发生变化的,由此可以实现UI设计中的渲染对象按照旋转轨道的轨迹进行移动的同时,实现三维动画展示。在实现定时操作时一般通过setInterval设定计时器来实现,后续详细介绍之。
可选地,基于上述任一实施例,本申请步骤S201和步骤S203是由主线程实施的。但在实际应用中,由于JS的单线程特性,主线程在使用setInterval方法进行定时计算时,如果计算耗时,会阻塞主线程其他工作,特别是在数据可视化中,动画组件一般不止一个,假如页面上此时还有其他操作,则会导致计时器不准确,动画卡顿等问题,因此为了解决这一问题,本申请实施例提出下述过程:
调用子线程,以使子线程基于旋转轨道和渲染对象在所述旋转轨道的初始位置,确定渲染对象按照旋转轨道移动的目标位置,以及确定渲染对象的缩放程度和层叠顺序。
具体实施时,通过调用webworker子线程来执行步骤S202中的相关过程,即确定渲染对象的目标位置、缩放程度和层叠顺序,然后将上述三个计算结果反馈给主线程,这样可以有效节约主线程的资源,由于计算过程由子线程程实施,主线程可以有更多的资源进行三维动画展示,从而避免了动画的卡顿,能够更好地、更流畅地对渲染对象进行三维动画展示。
通过实施本申请提供的对象渲染方法,在获取到包括渲染对象的二维图像后,依据该渲染对象的渲染需求确定该渲染对象的旋转轨道,然后基于该旋转轨道和该渲染对象在旋转轨道的初始位置,确定该渲染对象按照旋转轨道移动的目标位置,以及移动时渲染对象的缩放程度和层叠顺序,进而基于确定出的目标位置、缩放程度和层叠顺序对该渲染对象进行三维渲染,由此直接对二维图像中的渲染对象进行处理,实现了流畅且真实的三维动画渲染效果,也即基于二维图像达到了模拟三维展示的效果,这样就避免使用现有技术中的三维框架,从而降低了硬件设备的要求且避免了资源的浪费。
基于同一发明构思,本申请还提供了与上述对象渲染方法对应的对象渲染装置。该对象渲染装置的实施具体可以参考上述对对象渲染方法的描述,此处不再一一论述。
参见图5,图5是本申请一示例性实施例示出的一种对象渲染装置,上述对象渲染装置包括:
获取模块501,用于获取包括渲染对象的二维图像,并依据所述渲染对象的渲染需求确定所述渲染对象的旋转轨道;
确定模块502,用于基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,所述层叠顺序用于表征所述渲染对象在叠加顺序上的上下立体关系;
渲染模块503,用于根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示。
可选地,本实施例的确定模块502,具体用于调用子线程,以使子线程基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序。
可选地,本申请实施例中的渲染需求包括所述旋转轨道的轨道参数;则
上述确定模块502,具体用于基于所述旋转轨道的中心点的位置和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度;基于所述轨道参数和所述旋转角度,确定所述渲染对象的目标位置;根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序。
可选地,上述确定模块502,具体用于若基于所述旋转角度,确定所述渲染对象接近视点,则调大所述渲染对象的缩放程度,以放大所述渲染对象,以及增大所述渲染对象的层叠顺序值;若基于所述旋转角度,确定所述渲染对象远离视点,则调小所述渲染对象的缩放程度,以缩小所述渲染对象,以及减少所述渲染对象的层叠顺序值。
可选地,上述渲染模块503,具体用于根据所述渲染对象的目标位置、缩放程度和层叠顺序,通过层叠样式表CSS对所述渲染对象进行三维渲染及展示。
基于同一发明构思,本申请实施例还提供了一种电子设备,包括处理器和机器可读存储介质,所述机器可读存储介质存储有能够被所述处理器执行的机器可执行指令,所述处理器被所述机器可执行指令促使执行本申请任一实施例提供的对象渲染方法。
另外,本申请实施例还提供了一种机器可读存储介质,机器可读存储介质存储有机器可执行指令,在被处理器调用和执行时,机器可执行指令促使处理器执行本申请实施例所提供的对象渲染方法。
对于电子设备以及机器可读存储介质实施例而言,由于其涉及的方法内容基本相似于前述的方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
上述装置中各个单元的功能和作用的实现过程具体详见上述方法中对应步骤的实现过程,在此不再赘述。
对于装置实施例而言,由于其基本对应于方法实施例,所以相关之处参见方法实施例的部分说明即可。以上所描述的装置实施例仅仅是示意性的,其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本申请方案的目的。本领域普通技术人员在不付出创造性劳动的情况下,即可以理解并实施。
以上所述仅为本申请的较佳实施例而已,并不用以限制本申请,凡在本申请的精神和原则之内,所做的任何修改、等同替换、改进等,均应包含在本申请保护的范围之内。

Claims (10)

1.一种对象渲染方法,其特征在于,包括:
获取包括渲染对象的二维图像,并依据所述渲染对象的渲染需求确定所述渲染对象的旋转轨道;
基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,所述层叠顺序用于表征所述渲染对象在叠加顺序上的上下立体关系;
根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示。
2.根据权利要求1所述的方法,其特征在于,基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度,包括:
调用子线程,以使子线程基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序。
3.根据权利要求1或2所述的方法,其特征在于,所述渲染需求包括所述旋转轨道的轨道参数;则
基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,包括:
基于所述旋转轨道的中心点的位置和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度;
基于所述轨道参数和所述旋转角度,确定所述渲染对象的目标位置;
根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序。
4.根据权利要求3所述的方法,其特征在于,根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序,包括:
若基于所述旋转角度,确定所述渲染对象接近视点,则调大所述渲染对象的缩放程度,以放大所述渲染对象,以及增大所述渲染对象的层叠顺序值;
若基于所述旋转角度,确定所述渲染对象远离视点,则调小所述渲染对象的缩放程度,以缩小所述渲染对象,以及减少所述渲染对象的层叠顺序值。
5.根据权利要求1所述的方法,其特征在于,根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示,包括:
根据所述渲染对象的目标位置、缩放程度和层叠顺序,通过层叠样式表CSS对所述渲染对象进行三维渲染及展示。
6.一种对象渲染装置,其特征在于,包括:
获取模块,用于获取包括渲染对象的二维图像,并依据所述渲染对象的渲染需求确定所述渲染对象的旋转轨道;
确定模块,用于基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序,所述层叠顺序用于表征所述渲染对象在叠加顺序上的上下立体关系;
渲染模块,用于根据所述渲染对象的目标位置、缩放程度和层叠顺序对所述渲染对象进行三维渲染及展示。
7.根据权利要求6所述的装置,其特征在于,
所述确定模块,具体用于调用子线程,以使子线程基于所述旋转轨道和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象按照所述旋转轨道移动的目标位置,以及确定所述渲染对象的缩放程度和层叠顺序。
8.根据权利要求6或7所述的装置,其特征在于,所述渲染需求包括所述旋转轨道的轨道参数;则
所述确定模块,具体用于基于所述旋转轨道的中心点的位置和所述渲染对象在所述旋转轨道的初始位置,确定所述渲染对象的旋转角度;基于所述轨道参数和所述旋转角度,确定所述渲染对象的目标位置;根据所述旋转角度,调节所述渲染对象的缩放程度和层叠顺序。
9.根据权利要求8所述的装置,其特征在于,
所述确定模块,具体用于若基于所述旋转角度,确定所述渲染对象接近视点,则调大所述渲染对象的缩放程度,以放大所述渲染对象,以及增大所述渲染对象的层叠顺序值;若基于所述旋转角度,确定所述渲染对象远离视点,则调小所述渲染对象的缩放程度,以缩小所述渲染对象,以及减少所述渲染对象的层叠顺序值。
10.根据权利要求6所述的装置,其特征在于,
所述渲染模块,具体用于根据所述渲染对象的目标位置、缩放程度和层叠顺序,通过层叠样式表CSS对所述渲染对象进行三维渲染及展示。
CN202010132731.7A 2020-02-29 2020-02-29 一种对象渲染方法和装置 Active CN111476870B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010132731.7A CN111476870B (zh) 2020-02-29 2020-02-29 一种对象渲染方法和装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010132731.7A CN111476870B (zh) 2020-02-29 2020-02-29 一种对象渲染方法和装置

Publications (2)

Publication Number Publication Date
CN111476870A true CN111476870A (zh) 2020-07-31
CN111476870B CN111476870B (zh) 2022-08-30

Family

ID=71747561

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010132731.7A Active CN111476870B (zh) 2020-02-29 2020-02-29 一种对象渲染方法和装置

Country Status (1)

Country Link
CN (1) CN111476870B (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2023197729A1 (zh) * 2022-04-14 2023-10-19 腾讯科技(深圳)有限公司 对象渲染方法、装置、电子设备及存储介质

Citations (13)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20020063057A (ko) * 2001-01-26 2002-08-01 한탁돈 순서 비의존 투명성을 하드웨어적으로 제공해주는 병렬 렌더링 가속기
WO2003034343A1 (fr) * 2001-10-15 2003-04-24 Fujitsu Limited Tri hierarchique d'objets lies dans un espace tridimensionnel virtuel
US20110090225A1 (en) * 2009-10-20 2011-04-21 Sun Microsystems, Inc. System and method for applying level of detail schemes
CN103559730A (zh) * 2013-11-20 2014-02-05 广州博冠信息科技有限公司 一种渲染方法及装置
CN104520903A (zh) * 2012-01-31 2015-04-15 谷歌公司 用于改进多姿态3d渲染的速度和视觉保真度的方法
CN107038751A (zh) * 2015-12-07 2017-08-11 达索系统公司 从2d图像进行3d建模对象的识别
CN107958480A (zh) * 2017-11-23 2018-04-24 腾讯科技(上海)有限公司 图像渲染方法、装置及存储介质
CN108564646A (zh) * 2018-03-28 2018-09-21 腾讯科技(深圳)有限公司 对象的渲染方法和装置、存储介质、电子装置
CN109448089A (zh) * 2018-10-22 2019-03-08 美宅科技(北京)有限公司 一种渲染方法及装置
CN109543130A (zh) * 2018-11-06 2019-03-29 新华三大数据技术有限公司 三维场景下标签的显示方法及装置
CN109658325A (zh) * 2018-12-24 2019-04-19 成都四方伟业软件股份有限公司 一种三维动画渲染方法及装置
US20190156545A1 (en) * 2017-11-21 2019-05-23 Microsoft Technology Licensing, Llc Animating three-dimensional models using preset combinations of animation features
CN109829982A (zh) * 2019-01-28 2019-05-31 Oppo广东移动通信有限公司 模型匹配方法、装置、终端设备及存储介质

Patent Citations (13)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
KR20020063057A (ko) * 2001-01-26 2002-08-01 한탁돈 순서 비의존 투명성을 하드웨어적으로 제공해주는 병렬 렌더링 가속기
WO2003034343A1 (fr) * 2001-10-15 2003-04-24 Fujitsu Limited Tri hierarchique d'objets lies dans un espace tridimensionnel virtuel
US20110090225A1 (en) * 2009-10-20 2011-04-21 Sun Microsystems, Inc. System and method for applying level of detail schemes
CN104520903A (zh) * 2012-01-31 2015-04-15 谷歌公司 用于改进多姿态3d渲染的速度和视觉保真度的方法
CN103559730A (zh) * 2013-11-20 2014-02-05 广州博冠信息科技有限公司 一种渲染方法及装置
CN107038751A (zh) * 2015-12-07 2017-08-11 达索系统公司 从2d图像进行3d建模对象的识别
US20190156545A1 (en) * 2017-11-21 2019-05-23 Microsoft Technology Licensing, Llc Animating three-dimensional models using preset combinations of animation features
CN107958480A (zh) * 2017-11-23 2018-04-24 腾讯科技(上海)有限公司 图像渲染方法、装置及存储介质
CN108564646A (zh) * 2018-03-28 2018-09-21 腾讯科技(深圳)有限公司 对象的渲染方法和装置、存储介质、电子装置
CN109448089A (zh) * 2018-10-22 2019-03-08 美宅科技(北京)有限公司 一种渲染方法及装置
CN109543130A (zh) * 2018-11-06 2019-03-29 新华三大数据技术有限公司 三维场景下标签的显示方法及装置
CN109658325A (zh) * 2018-12-24 2019-04-19 成都四方伟业软件股份有限公司 一种三维动画渲染方法及装置
CN109829982A (zh) * 2019-01-28 2019-05-31 Oppo广东移动通信有限公司 模型匹配方法、装置、终端设备及存储介质

Non-Patent Citations (3)

* Cited by examiner, † Cited by third party
Title
AVNISH PATEL 等: "3D Modeling and Rendering of 2D Medical Image", 《2012 INTERNATIONAL CONFERENCE ON COMMUNICATION SYSTEMS AND NETWORK TECHNOLOGIES》 *
丛红艳: "基于多帧二维动画图像的三维自动生成技术", 《现代电子技术》 *
孔素然 等: "三维动画图像纹理实时渲染系统设计", 《现代电子技术》 *

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2023197729A1 (zh) * 2022-04-14 2023-10-19 腾讯科技(深圳)有限公司 对象渲染方法、装置、电子设备及存储介质

Also Published As

Publication number Publication date
CN111476870B (zh) 2022-08-30

Similar Documents

Publication Publication Date Title
CN107564089B (zh) 三维图像处理方法、装置、存储介质和计算机设备
CN106502427B (zh) 虚拟现实系统及其场景呈现方法
US11282264B2 (en) Virtual reality content display method and apparatus
US9886102B2 (en) Three dimensional display system and use
CN109741463B (zh) 虚拟现实场景的渲染方法、装置及设备
WO2018219091A1 (zh) 用于显示弹幕的方法、装置以及存储介质
EP3662662B1 (en) Parallax viewer system for 3d content
CN109598796A (zh) 将真实场景与虚拟物体进行3d融合显示的方法和装置
EP3683656A1 (en) Virtual reality (vr) interface generation method and apparatus
CN110555796A (zh) 图像调整方法、装置、存储介质以及设备
US11477432B2 (en) Information processing apparatus, information processing method and storage medium
CN106774821B (zh) 基于虚拟现实技术的显示方法和系统
CN111275801A (zh) 一种三维画面渲染方法及装置
CN113206993A (zh) 一种调整显示屏幕的方法及显示设备
CN111476870B (zh) 一种对象渲染方法和装置
CN110548289B (zh) 一种三维控件显示的方法和装置
KR102176805B1 (ko) 뷰 방향이 표시되는 vr 컨텐츠 제공 시스템 및 방법
CN111047674A (zh) 一种动画渲染方法及装置
CN111292234A (zh) 一种全景图像生成方法及装置
CN112667137B (zh) 户型图和房屋三维模型的切换显示方法及装置
CN114327174A (zh) 虚拟现实场景的显示方法、光标的三维显示方法和装置
KR20160143936A (ko) 선택적 3d 렌더링 방법 및 이를 위한 시스템
KR101741149B1 (ko) 가상 카메라의 시점 제어 방법 및 장치
US11910068B2 (en) Panoramic render of 3D video
CN110517179B (zh) Vr 3d模型水印添加方法和系统

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
GR01 Patent grant
GR01 Patent grant