CN112905293A - 图形加载方法与系统以及图形渲染方法与系统 - Google Patents

图形加载方法与系统以及图形渲染方法与系统 Download PDF

Info

Publication number
CN112905293A
CN112905293A CN202110326782.8A CN202110326782A CN112905293A CN 112905293 A CN112905293 A CN 112905293A CN 202110326782 A CN202110326782 A CN 202110326782A CN 112905293 A CN112905293 A CN 112905293A
Authority
CN
China
Prior art keywords
graphics
preset
preset number
graphs
resolution
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
CN202110326782.8A
Other languages
English (en)
Other versions
CN112905293B (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.)
Seashell Housing Beijing Technology Co Ltd
Original Assignee
Beijing Fangjianghu 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 Fangjianghu Technology Co Ltd filed Critical Beijing Fangjianghu Technology Co Ltd
Priority to CN202110326782.8A priority Critical patent/CN112905293B/zh
Publication of CN112905293A publication Critical patent/CN112905293A/zh
Application granted granted Critical
Publication of CN112905293B publication Critical patent/CN112905293B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T15/00—3D [Three Dimensional] image rendering
    • G06T15/005—General purpose rendering architectures
    • Y—GENERAL 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
    • Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02D—CLIMATE 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/00—Energy efficient computing, e.g. low power processors, power management or thermal management

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • General Engineering & Computer Science (AREA)
  • Computer Graphics (AREA)
  • Image Generation (AREA)
  • Controls And Circuits For Display Device (AREA)

Abstract

本发明涉及渲染技术领域，公开一种图形加载系统与方法及图形渲染系统与方法。所述图形加载方法包括：通过服务器对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形；从服务器上加载第一预设数目个图形，并将第一预设数目个图形设置为天空盒的纹理，以采用第二预设分辨率渲染目标图形；以及在检测到系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将天空盒的纹理渐进地替换为第二预设数目个图形，以采用第二预设分辨率重新渲染目标图形。本发明极大地压缩天空盒的可视时间，并在浏览过程中无感知地使全景图逐渐从模糊变得清晰。

Description

图形加载方法与系统以及图形渲染方法与系统
技术领域
本发明涉及渲染技术领域，具体地涉及一种图形加载方法、图形加载系统、图形渲染方法与图形渲染系统、机器可读存储介质及电子设备。
背景技术
C端产品需要考虑多平台兼容问题，图片一般采用压缩纹理和jpeg两种格式：在安卓/PC环境下使用压缩纹理图片，一张图片大约需要4MB流量；在IOS环境下由于兼容问题采用jpeg图片，一张图片约需要8MB流量。在4G网络环境中，平均打开一张图片的时间均在10s以上，且在画布(3D/2D，即三维/二维)环境下无法使用交错式图片渐进加载(只能在完全加载完一张图片后，才可绘制另一张图片)。图片的超长加载时间极其容易让用户产生假死的感觉，从而用户通常会在图片加载完成前关闭页面。
发明内容
本发明的目的是提供一种图形加载方法、图形加载系统、图形渲染方法与图形渲染系统、机器可读存储介质及电子设备，其极大地压缩天空盒的可视时间，并在用户的浏览过程中无感知地使全景图逐渐从模糊变得清晰，从而可极大地提高用户的体验和留存率。
为了实现上述目的，本发明第一方面提供一种图形加载方法，所述图形加载方法包括：通过服务器对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，其中，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形；检测用于渲染所述目标图形的系统内存的大小；以及在所述系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形，其中，所述第三预设分辨率大于所述第二预设分辨率。
优选地，所述将所述天空盒的纹理渐进地替换为所述第二预设数目个图形包括：将所述第一预设数目个图形进行等倍数放大，并将放大后的所述第一预设数目个图形绘制在所述2D画布上，其中，所述第一预设数目个图形的总尺寸等于所述目标图形的尺寸；将所述2D画布设置为所述天空盒的纹理，以继续渲染所述目标图形；按照所述第二预设数目个图形在所述目标图形中的位置，对所述第二预设数目个图形进行排序；从所述服务器上加载所述第二预设数目个图形中的与所述天空盒的主视角覆盖区域相对应的第一组图形，并将所述第一组图形绘制在所述2D画布的相应位置上，其中，所述第二预设数目个图形包括：所述第一组图形与第二组图形；以及以所述第一组图形的垂直方向上的对称轴为中心，按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形，并按照所述第一预设规则将所述第二组图形绘制在所述2D画布的相应位置上。
优选地，所述按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形包括：以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的非最顶层图形及非最底层图形进行加载；以及以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的最顶层图形及最底层图形进行加载。
优选地，在所述天空盒的形状为球体的情况下，所述第一预设数目个图形为两个图形，相应地，在执行所述将所述天空盒的纹理渐进地替换为所述第二预设数目个图形的步骤的过程中，所述图形加载方法还包括：检测用于切换至不同视角的滑动动作；在检测到所述滑动动作的情况下，暂停针对所述第二预设数目个图形的加载动作，并记录当前正在加载的图形及所述第二预设数目个图形中的未被加载的图形，其中，所述未被加载的图形包括：第三组图形，该第三组图形包括与所述天空盒的不同视角的预设覆盖区域相对应的图形中的未被加载的图形；及第四组图形，该第四组图形包括与所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域相对应的图形中的未被加载的图形；根据所述滑动动作，采用所述第二加载方式及所述2D画布，将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形；以及从所述当前正在加载的图形开始，采用所述第一加载方式及所述2D画布，将所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域的纹理渐进地替换为所述第四组图形。
优选地，所述将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形包括：确定所述滑动动作对应的滑动起点及滑动矢量；确定与所述滑动起点相对应的所述第二预设数目个图形中的特定图形，其中，所述特定图形已被加载；以及以所述特定图形为起点且沿所述滑动矢量的方向，按照第二预设规则从所述服务器上依次加载所述第三组图形，并将所述第三组图形绘制在所述2D画布的相应位置上。
优选地，所述按照第二预设规则从所述服务器上依次加载所述第三组图形包括：采用预设覆盖区域为扫描单位，将所述扫描单位的中心从所述特定图形开始且沿所述滑动矢量的方向对所述第二预设数目个图形进行扫描，直至所述扫描单位的中心遇到最顶层图形、最底层图形或已被加载的图形中的任一者；以及按照扫描的先后顺序对扫描到的所述第三组图形进行加载，并将所加载的所述第三组图形绘制在所述2D画布的相应位置上。
优选地，在执行所述检测用于渲染所述目标图形的系统内存的大小的步骤之前，所述图形加载方法还包括：通过所述服务器对所述目标图形进行预处理，以形成具有第四预设分辨率的第一预设数目个图形，其中，所述第三预设分辨率大于或等于所述第四预设分辨率，且所述第四预设分辨率大于所述第二预设分辨率，相应地，在执行所述检测用于渲染所述目标图形的系统内存的大小的步骤之后，所述图形加载方法还包括：在所述系统内存的大小小于或等于所述预设值的情况下，采用第三加载方式，将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形，以采用所述第四预设分辨率重新渲染所述目标图形。
优选地，所述将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形包括：通过多个线程从所述服务器上加载所述具有第四预设分辨率的第一预设数目个图形，以获取所述具有第四预设分辨率的第一预设数目个图形的加载数据；将所述加载数据拼接成所述具有第四预设分辨率的第一预设数目个图形；以及将所述天空盒的纹理替换为拼接成的所述具有第四预设分辨率的第一预设数目个图形，以采用所述第四预设分辨率重新渲染所述目标图形。
通过上述技术方案，本发明实施例创造性地首先通过服务器对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，然后从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形，最后在检测到用于渲染所述目标图形的系统内存较大的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形。由此，本发明可极大地压缩天空盒的可视时间，并在用户的浏览过程中无感知地使全景图逐渐从模糊变得清晰，从而可极大地提高用户的体验和留存率。
本发明第二方面还提供一种图形渲染方法，所述图形渲染方法包括：检测用于渲染目标图形的系统内存的大小，其中，所述目标图形根据所述的图形加载方法被预处理成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；在所述系统内存的大小大于预设值的情况下，响应于根据所述图形加载方法将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形；以及响应于根据所述图形加载方法将所述天空盒的纹理渐进地替换为所述具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。
优选地，在所述目标图形根据权利要求7或8所述的图形加载方法被预处理成具有第四预设分辨率的第一预设数目个图形的情况下，所述图形渲染方法还包括：在所述系统内存的大小小于或等于所述预设值的情况下，响应于根据所述图形加载方法将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形的动作，渲染所述具有第四预设分辨率的第一预设数目个图形。
通过上述技术方案，本发明创造性地在检测到用于渲染目标图形的系统内存较大的情况下，响应于根据所述图形加载方法将具有第一预设分辨率的第一预设数目个图形设置为天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形，然后响应于将所述天空盒的纹理渐进地替换为具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。由此，本发明可极大地压缩天空盒的可视时间，并在用户的浏览过程中无感知地使全景图逐渐从模糊变得清晰，从而可极大地提高用户的体验和留存率。
本发明第三方面还提供一种图形加载系统，所述图形加载系统包括：服务器，用于对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，其中，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；第一加载器，用于从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形；第一检测装置，用于检测用于渲染所述目标图形的系统内存的大小；以及第一替换装置，用于在所述系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形，其中，所述第三预设分辨率大于所述第二预设分辨率。
优选地，所述替换装置包括：绘制模块，用于将所述第一预设数目个图形进行等倍数放大，并将放大后的所述第一预设数目个图形绘制在所述2D画布上，其中，所述第一预设数目个图形的总尺寸等于所述目标图形的尺寸；设置模块，用于将所述2D画布设置为所述天空盒的纹理，以继续渲染所述目标图形；排序模块，用于按照所述第二预设数目个图形在所述目标图形中的位置，对所述第二预设数目个图形进行排序；第二加载器，用于从所述服务器上加载所述第二预设数目个图形中的与所述天空盒的主视角覆盖区域相对应的第一组图形，并将所述第一组图形绘制在所述2D画布的相应位置上，其中，所述第二预设数目个图形包括：所述第一组图形与第二组图形；以及第三加载器，用于以所述第一组图形的垂直方向上的对称轴为中心，按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形，并按照所述第一预设规则将所述第二组图形绘制在所述2D画布的相应位置上。
优选地，所述第一加载器包括：第一加载模块，用于以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的非最顶层图形及非最底层图形进行加载；以及第二加载模块，用于以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的最顶层图形及最底层图形进行加载。
优选地，在所述天空盒的形状为球体的情况下，所述第一预设数目个图形为两个图形，相应地，所述图形加载系统还包括：第二检测装置，用于检测用于切换至不同视角的滑动动作；暂停装置，用于在检测到所述滑动动作的情况下，暂停针对所述第二预设数目个图形的加载动作，并记录当前正在加载的图形及所述第二预设数目个图形中的未被加载的图形，其中，所述未被加载的图形包括：第三组图形，该第三组图形包括与所述天空盒的不同视角的预设覆盖区域相对应的图形中的未被加载的图形；及第四组图形，该第四组图形包括所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域相对应的图形中的未被加载的图形；第二替换装置，用于根据所述滑动动作，采用所述第二加载方式及所述2D画布，将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形；以及第三替换装置，用于从所述当前正在加载的图形开始，采用所述第一加载方式及所述2D画布，将所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域的纹理渐进地替换为所述第四组图形。
优选地，所述第二替换装置包括：矢量确定模块，用于确定所述滑动动作对应的滑动起点及滑动矢量；特定图形确定模块，用于确定与所述滑动起点相对应的所述第二预设数目个图形中的特定图形，其中，所述特定图形已被加载；以及第四加载器，用于以所述特定图形为起点且沿所述滑动矢量的方向，按照第二预设规则从所述服务器上依次加载所述第三组图形，并将所述第三组图形绘制在所述2D画布的相应位置上。
优选地，所述第四加载器包括：扫描模块，用于采用预设覆盖区域为扫描单位，将所述扫描单位的中心从所述特定图形开始且沿所述滑动矢量的方向对所述第二预设数目个图形进行扫描，直至所述扫描单位的中心遇到达到最顶层图形、最底层图形或已被加载的图形所述第二特定图形中的任一者；以及第三加载模块，用于按照扫描的先后顺序对扫描到的所述第三组图形进行加载，并将所加载的所述第三组图形绘制在所述2D画布的相应位置上。
优选地，所述服务器还用于，对所述目标图形进行预处理，以形成具有第四预设分辨率的第一预设数目个图形，其中，所述第三预设分辨率大于或等于所述第四预设分辨率，且所述第四预设分辨率大于所述第二预设分辨率，相应地，所述图形加载系统还包括：第五加载器，用于在所述系统内存的大小小于或等于所述预设值的情况下，采用第三加载方式，将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形，以采用所述第四预设分辨率重新渲染所述目标图形。
优选地，所述第五加载器包括：第四加载模块，用于通过多个线程从所述服务器上加载所述具有第四预设分辨率的第一预设数目个图形，以获取所述具有第四预设分辨率的第一预设数目个图形的加载数据；拼接模块，用于将所述加载数据拼接成所述具有第四预设分辨率的第一预设数目个图形；以及替换模块，用于将所述天空盒的纹理替换为拼接成的所述具有第四预设分辨率的第一预设数目个图形，以采用所述第三预设分辨率重新渲染所述目标图形。
有关本发明提供的图形加载系统的具体细节及益处可参阅上述针对图形加载方法的描述，于此不再赘述。
本发明第四方面还提供一种图形渲染系统，所述图形渲染系统包括：检测装置，用于检测用于加载目标图形的系统内存的大小，其中，所述目标图形由所述的图形加载系统被预处理成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；第一渲染装置，用于在所述系统内存的大小大于预设值的情况下，响应于根据所述图形加载系统将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形；以及第二渲染装置，用于响应于根据所述图形加载系统将所述天空盒的纹理渐进地替换为所述具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。
在所述目标图形由所述的图形加载系统被预处理成具有第四预设分辨率的第一预设数目个图形的情况下，所述图形渲染系统还包括：第三渲染装置，用于在所述系统内存的大小小于或等于所述预设值的情况下，响应于根据所述图形加载系统将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形的动作，渲染所述具有第四预设分辨率的第一预设数目个图形。
有关本发明提供的图形渲染系统的具体细节及益处可参阅上述针对图形渲染方法的描述，于此不再赘述。
本发明第五方面还提供一种机器可读存储介质，所述机器可读存储介质上存储有指令，该指令用于使得机器执行上述的图形加载方法及根据所述的图形渲染方法。
本发明第六方面还提供一种电子设备，其特征在于，所述电子设备包括：处理器；用于存储所述处理器可执行指令的存储器；所述处理器，用于从所述存储器中读取所述可执行指令，并执行所述指令以实现所述的图形加载方法及根据所述的图形渲染方法。
本发明的其它特征和优点将在随后的具体实施方式部分予以详细说明。
附图说明
附图是用来提供对本发明实施例的进一步理解，并且构成说明书的一部分，与下面的具体实施方式一起用于解释本发明实施例，但并不构成对本发明实施例的限制。在附图中：
图1是本发明一实施例提供的图形加载方法的流程图；
图2是本发明一实施例提供的将天空盒的纹理渐进地替换为第二预设数目个图形的流程图；
图3是本发明一实施例提供的交互动作影响下的3D图形的加载过程的流程图；以及
图4是本发明一实施例提供的将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形的流程图。
具体实施方式
以下结合附图对本发明的具体实施方式进行详细说明。应当理解的是，此处所描述的具体实施方式仅用于说明和解释本发明，并不用于限制本发明。
图1是本发明一实施例提供的一种图形加载方法的流程图。如图1所示，所述图形加载方法可包括以下步骤S101-S104。
步骤S101，通过服务器对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形。
其中，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍。具体地，所述天空盒的形状可为球体，相应地，所述第一预设数目为2，以及所述第二预设数目可为32；或者所述天空盒的形状可为立方体，相应地，所述第一预设数目为6，以及所述第二预设数目可为96。
具体地，以球体形状的天空盒(即3D球体天空盒)为例，所述第一预设数目可为2。服务端将分辨率为8192px*4096px的目标图形(即全景图)拆分为2张分辨率为4096px*4096px的正方形图形(即下文中的具有第三预设分辨率的2个图形)，并记录图形的字节数。然后，所述服务端将2张分辨率为4096px*4096px的图形压缩为分辨率为720px*720px的预览图(即具有第一预设分辨率的2个图形)。最后，所述服务端将分辨率为8192px*4096px的目标图形拆分为32张分辨率为1024px*1024px的正方形小图(具有第二预设分辨率的32个图形)。
当然，在目标图形的分辨率不满足2N+1px*2Npx的情况下(例如，分辨率为(3*2N)px*2Npx)，将所述目标图形拆分为两张分辨率为(1.5*2N)px*2Npx的图形(即下文中的具有第三预设分辨率的2个图形)，并记录图形的字节数，其中N为大于某预设值的正整数。然后，所述服务端将2张分辨率为(1.5*2N)px*2Npx的图形压缩为分辨率为1080px*720px的预览图(即具有第一预设分辨率的2个图形)。最后，所述服务端将分辨率为(3*2N)px*2Npx的目标图形拆分为32张分辨率为1024px*1024px的正方形小图(具有第二预设分辨率的32个图形)。对于分辨率为2N+1px*2Npx的目标图形，用户可360度旋转观看目标图形，而对于分辨率不满足2N+1px*2Npx的目标图形而言，需要根据目标分辨率相应地限制用户观察的角度。
步骤S102，从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形。
(前端)页面从所述服务器上加载步骤S101所形成的两张低清预览图(即两张分辨率为720px*720px的预览图)，并将这两张低清预览图设置为3D球体天空盒的左半球和右半球的纹理。与此同时，3D渲染器响应于根据所述图形加载方法将2张分辨率为720px*720px的预览图设置为天空盒的纹理的动作，渲染这2张分辨率为720px*720px的预览图。该过程以使用户可极速地观察到该低清图，从而可极大地压缩天空盒的可视时间(例如，在用户网络理想的情况下，天空盒的可视时间被从10s以上压缩至1s以内)，进而大大提高用户体验和留存率。
然而，此时所渲染的目标图形的分辨率较低，下面接着介绍如何在用户无感知的情况下使得全景图从模糊变得清晰。
在执行步骤S103之前，所述图形加载方法还可包括：通过所述服务器对所述目标图形进行预处理，以形成具有第四预设分辨率的第一预设数目个图形。其中，所述第三预设分辨率大于或等于所述第四预设分辨率，且所述第四预设分辨率大于所述第二预设分辨率。
例如，可参见在步骤S101中的描述，服务端将分辨率为8192px*4096px的目标图形拆分为2张分辨率为4096px*4096px(第四预设分辨率，其等于第三预设分辨率(即2D画布的分辨率))的正方形图形。
当然，上述获取具有第三预设分辨率的第一预设数目个图形的步骤也可与步骤S101一起执行。
步骤S103，检测用于渲染所述目标图形的系统内存的大小。
从服务器上加载完毕后，根据不同的机型执行不同方法，以使得全景图从模糊变得清晰。具体地，对于大内存的机型(如PC/安卓高端机)，执行步骤S104；对于小内存的机型(如iphone机)，则采用第三加载方式，将天空盒的纹理整体地替换为具有第三预设分辨率的第一预设数目个图形。
步骤S104，在所述系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形。
其中，所述第三预设分辨率大于所述第二预设分辨率。
对于步骤S104，如图2所示，所述将所述天空盒的纹理渐进地替换为所述第二预设数目个图形包括以下步骤S201-S205。
步骤S201，将所述第一预设数目个图形进行等倍数放大，并将放大后的所述第一预设数目个图形绘制在所述2D画布上。
其中，所述第一预设数目个图形的总尺寸等于所述目标图形的尺寸。
具体地，可首先生成两个分辨率为至少为4096px*4096px的2D画布。然后，由于在步骤S101对目标图形进行压缩的过程中，分辨率为720px*720px的预览图的尺寸变小，故可按照之前的压缩比例将预览图放大绘制到2D画布中，以使其呈现为原始尺寸的预览图。所述目标图形在压缩的过程中丢失部分信息，即使现在又放大至原始尺寸(分辨率恢复至4096px*4096px)，但由于无法找回丢失的信息，故其呈现的图形仍为较为模糊的图形(相当于低清图)。
步骤S202，将所述2D画布设置为所述天空盒的纹理，以继续渲染所述目标图形。
具体地，可将步骤S201中的所述2D画布作为左、右半球的纹理，以替换步骤S102中所设置的低清预览图(即两张分辨率为4096px*4096px的预览图)的纹理。与此同时，3D渲染器响应于所述天空盒的纹理替换为两张分辨率为4096px*4096px的预览图的动作，渲染这2张分辨率为4096px*4096px的图，而用户不会发现任何变化。
也就是说，对于大内存的系统而言，可将2D画布作为天空盒的纹理载体，从而可通过更改2D画布上的绘制图形来更换天空盒的纹理。
步骤S203，按照所述第二预设数目个图形在所述目标图形中的位置，对所述第二预设数目个图形进行排序。
具体地，通过步骤S101所形成的所述第二预设数目个图形(例如32张图形)可具有表1所示的标识(例如，全景图中的各个图形具有不同的编号，即编号代表其在全景图中的位置)。例如，按照各个图形在目标图形(即全景图)中的不同位置。
表1 32张图形的标识为排序
Figure BDA0002994965750000141
步骤S204，从所述服务器上加载所述第二预设数目个图形中的与所述天空盒的主视角覆盖区域相对应的第一组图形，并将所述第一组图形绘制在所述2D画布的相应位置上。
其中，所述第二预设数目个图形包括：所述第一组图形与第二组图形。
若标识为20、21、28、29为天空盒默认的主视角覆盖的区域，则先从服务器上同步加载该标识为20、21、28、29的四张图形，并按照这四张图形在目标图形中的位置，将这四张图形绘制在所述2D画布上的对应位置，从而3D渲染器响应于所述天空盒的主视角覆盖区域内的纹理替换为标识为20、21、28、29的四张图形的动作，渲染该标识为20、21、28、29的四张图形，从而可迅速向用户呈现主视角覆盖的区域内的图形。接着，通过步骤S204来渐进地向用户呈现标识为20、21、28、29的四张图形周围区域的其他图形。
步骤S205，以所述第一组图形的垂直方向上的对称轴为中心，按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形，并按照所述第一预设规则将所述第二组图形绘制在所述2D画布的相应位置上。
对于步骤S205，所述按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形可包括：以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的非最顶层图形及非最底层图形进行加载；以及以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的最顶层图形及最底层图形进行加载。
具体地，从服务器上按照(12,13)、(11,14)、(19,22)、(10,15)、(18,23)、(9,16)、(17,24)、(27,30)、(26,31)、(25,32)、(4,5)、(6,3)、(2,7)、(8,1)两两一组的顺序依次加载其他图片；与此同时，按照同样的顺序将各个图形绘制在所述2D画布上，以进行纹理更新直至全部图形加载完成(此加载顺序按照从中心向两侧展开后再加载底部和顶部的方式，最大限度的在用户无操作时优先加载可被预览到的区块)。此时，3D渲染器响应于将所述天空盒的纹理渐进地替换为32张分辨率为1024px*1024px的正方形图形的动作，渲染这32张分辨率为1024px*1024px的正方形图形。由此，在用户进行浏览的过程中无感知地使全景图分片逐渐从模糊变得清晰。
因此，对于大内存的系统而言，在加载的过程中，需要加载两张全景图(例如，渐进地加载32张分辨率为1024px*1024px的小图形，并加载两张分辨率为720px*720px的图形)。在加载过程中，可极速地将低清图加载并呈现给用户，从而极大地压缩了用户等待预览图的时长，并且可将2D画布设置为天空盒的纹理载体，可通过改变所述2D画布上的绘图来实现纹理的替换(无需将纹理从一张图形更改为另一张图形，这种两种图形替换的过程要同时加载两张全景图，从而很有可能导致系统卡顿)，从而使得全景图从模糊变得清晰。
在通过2D画布更换天空盒的纹理而使得全景图从模糊变得清晰的过程中，用户交互会影响上述的加载策略。在一实施例中，在所述天空盒的形状为球体的情况下，所述第一预设数目个图形为两个图形。相应地，在执行所述步骤S104的过程中，如图3所示，所述图形加载方法还可包括以下步骤S301-S304(即交互动作影响下的3D图形的加载过程)。
步骤S301，检测用于切换至不同视角的滑动动作。
在加载图形的过程中，实时检测是否存在用户的切换视角的请求。一旦用户通过触摸滑动/鼠标拖拽滑动的方式输入切换视角的请求，则在检测到用户输入的滑动动作(即切换至不同视角)时，执行步骤S302；否则仍保持实时检测的方式来监测用户的交互行为。
步骤S302，在检测到所述滑动动作的情况下，暂停针对所述第二预设数目个图形的加载动作，并记录当前正在加载的图形及所述第二预设数目个图形中的未被加载的图形。
其中，所述未被加载的图形包括：第三组图形，该第三组图形包括与所述天空盒的不同视角的预设覆盖区域相对应的图形(例如下文中所述的标识为14-16、9-11的图形)中的未被加载的图形；及第四组图形，该第四组图形包括与所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域相对应的图形中的未被加载的图形。
具体地，响应于用户切换至不同视角的请求，暂停所有加载器的加载过程。与此同时，记录当前正在加载的图形(例如，标识为11的图形)的标识(例如，11)及所述第二预设数目个图形中的未被加载的图形的标识。相应地，所述未被加载的图形可包括：第三组图形(具体为，标识为14-16、9-11的图形)及第四组图形(具体为，标识为(19,22)、(18,23)、(17,24)、(27,30)、(26,31)、(25,32)、(4,5)、(6,3)、(2,7)、(8,1)的图形)。
步骤S303，根据所述滑动动作，采用所述第二加载方式及所述2D画布，将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形。
对于步骤S303，如图4所示，所述将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形可包括以下步骤S401-S403。
步骤S401，确定所述滑动动作对应的滑动起点及滑动矢量。
具体地，若确定滑动动作的滑动起点为标识为13的图形上的一个特定点，滑动终点为标识为16的图形上的一个特定点，可计算所述滑动动作的滑动起点的物理坐标到滑动终点物理坐标的滑动矢量(例如滑动矢量的方向为由标识为13的图形的中心指向标识为16的图形的中心的矢量)。根据该滑动矢量可确定分片加载的顺序，以使用户想要浏览的区域及其周围区域内的图形能够快速呈现，从而极大地减少用户等待时长。
步骤S402，确定与所述滑动起点相对应的所述第二预设数目个图形中的特定图形。
其中，所述特定图形已被加载。
具体地，可确定交互起点与交互终点映射至图形分块所在的两个区域，以渐进地对所确定的两个区域之间的沿滑动矢量的方向上的图形(即用户所关注的区域)进行加载。
步骤S403，以所述特定图形为起点且沿所述滑动矢量的方向，按照第二预设规则从所述服务器上依次加载所述第三组图形，并将所第三组图形绘制在所述2D画布的相应位置上。
对于步骤S403，所述按照第二预设规则从所述服务器上依次加载所述第三组图形可包括：采用预设覆盖区域为扫描单位，将所述扫描单位的中心从所述特定图形开始且沿所述滑动矢量的方向对所述第二预设数目个图形进行扫描，直至所述扫描单位的中心遇到最顶层图形、最底层图形或已被加载的图形中的任一者，其中，所述预设覆盖区域为(2S-1)个图形*(2T-1)个图形所在的区域；以及按照扫描的先后顺序对扫描到的所述第三组图形进行加载，并将所述第三组图形绘制在所述2D画布的相应位置上。
其中，S与T均可为正整数，即所述预设覆盖区域为奇数个图形*奇数个图形的区域。由此，所述预设覆盖区域的中心(即扫描单位的中心)即为位于该预设覆盖区域中心的图形(可简称为中心图形)的中心，即中心图形正好覆盖一个图形，从而当中心图形完成扫描过程相当于对所有图形完成扫描过程。在各个实施例中，扫描过程中的扫描步长可为一个图形。
具体而言，若滑动矢量的方向为水平方向，则采用3*1的区域(即预设覆盖区域，也可称为图块)为扫描单位，将3*1的区域的中心从表1所示的标识为13的图形开始且扫沿步骤S303得到的滑动矢量的方向(例如由标识为13的图形的中心指向标识为16的图形的中心的方向)，在图片网格中进行扫描。当3*1的区域的中心遇到标识为16的图形时，继续扫描，直至遇到标识为12的图形(已被加载)为止，扫描过程遇到的图形即为第三组图形(即标识为14-16、9-11的图形)。注意：对于水平扫描的过程，可将表1所示的32张小图为两端相连接的环形图，故3*1的区域的中心到标识为16的图形时，该3*1的区域扫描到标识为15-16、9的图形，由于存在惯性，一般扫描单位的中心会顺延水平方向继续对标识为9的图形行进，直至遇到已被加载的图形12。与此同时，按照扫描到的网格顺序进行图块加载，当所遇到的图块已被加载(即在暂停加载步骤之前已被加载)，则跳过该图块。
当用户输入新的切换视角的请求时，重复执行类似于上述步骤S301-S303的过程。
步骤S304，从所述当前正在加载的图形开始，采用所述第一加载方式及所述2D画布，将所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域的纹理渐进地替换为所述第四组图形。
具体地，可从标识为11的图形开始，并采用类似于上述步骤S204描述的加载过程将天空盒中较为模糊的纹理渐进地替换为其他仍未被加载的图形，从而在完成所有清晰图形的加载与绘制过程之后，才可将非常清晰的全景图渲染给用户。
相应地，在执行步骤S103(所述检测用于渲染所述目标图形的系统内存的大小的步骤)之后，所述图形加载方法还可包括：在所述系统内存的大小小于或等于所述预设值的情况下，采用第三加载方式，将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形，以采用所述第四预设分辨率重新渲染所述目标图形。
其中，所述将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形可包括：通过多个线程从所述服务器上加载所述具有第四预设分辨率的第一预设数目个图形，以获取所述具有第四预设分辨率的第一预设数目个图形的加载数据；将所述加载数据拼接成所述具有第四预设分辨率的第一预设数目个图形；以及将所述天空盒的纹理替换为拼接成的所述具有第四预设分辨率的第一预设数目个图形，以采用所述第四预设分辨率重新渲染所述目标图形。
具体地，首先，根据所述具有第四预设分辨率的第一预设数目个图形(例如，2张分辨率为4096px*4096px的正方形图形)的字节数和用于为天空盒提供渲染环境的浏览器的支持情况，确定所述多个线程的数目。然后，将所述具有第四预设分辨率的第一预设数目个图形(例如，2张分辨率为4096px*4096px的正方形图形)拆分为所确定的多个线程(例如每个线程读取一定量的字节数据)进行加载，以获取与所述具有第四预设分辨率的第一预设数目个图形(例如，2张分辨率为4096px*4096px的正方形图形)相对应的字节数据。接着，在通过所有线程完成获取字节数据后，按主线程提供的各个字节数据在单个图中的排列顺序，使用二进制大对象(Blob)或数列缓冲(ArrayBuffer)将每张图形的字节数据拼接起来，并声明每张图形所对应的完整数据为jpeg图片格式。最后，将得到拼接成的两张图设置为左、右半球的纹理。
因此，对于小内存的系统而言，在加载的过程中，仅需要存储一张全景图(例如，2张分辨率为4096px*4096px的图形)。虽然这张全景图的分辨率较高，但由于通过多个线程的方式同步对其进行加载，故加载时间可极大地减少，从而可相应地压缩天空盒的可视时间，使用户在较短的时间内就能够观察到全景图。
综上所述，本发明实施例创造性地首先通过服务器对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，然后从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形，最后在检测到用于渲染所述目标图形的系统内存较大的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形。由此，本发明可极大地压缩天空盒的可视时间，并在用户的浏览过程中无感知地使全景图逐渐从模糊变得清晰，从而可极大地提高用户的体验和留存率。
本发明一实施例还提供一种图形渲染方法。所述图形渲染方法可包括：检测用于渲染目标图形的系统内存的大小，其中，所述目标图形根据所述的图形加载方法被预处理成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；在所述系统内存的大小大于预设值的情况下，响应于根据所述图形加载方法将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形；以及响应于根据所述图形加载方法将所述天空盒的纹理渐进地替换为所述具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。
具体地，以球体形状的天空盒(即3D球体天空盒)为例，所述第一预设数目可为2。首先，在检测到所述系统的内存大于预设值的情况下(即对于大内存的系统而言)，响应于根据所述图形加载方法将2张分辨率为720px*720px的预览图设置为天空盒的纹理的动作，渲染这2张分辨率为720px*720px的预览图。该过程以使用户可极速地观察到该低清图，从而可极大地压缩天空盒的可视时间(例如，在用户网络理想的情况下，天空盒的可视时间被从10s以上压缩至1s以内)，进而大大提高用户体验和留存率。其次，响应于将所述天空盒的纹理渐进地替换为32张分辨率为1024px*1024px的正方形小图的动作，渲染所述32张图形。该过程可在用户无感知的情况下使得全景图从模糊变得清晰。
在所述目标图形根据所述的图形加载方法被预处理成具有第四预设分辨率的第一预设数目个图形的情况下，所述图形渲染方法还可包括：在所述系统内存的大小小于或等于所述预设值的情况下，响应于根据所述图形加载方法将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形的动作，渲染所述具有第四预设分辨率的第一预设数目个图形。
具体地，以球体形状的天空盒(即3D球体天空盒)为例，所述第一预设数目可为2。在所述系统内存的大小小于或等于所述预设值的情况下(即对于小内存的系统而言)，响应于将所述天空盒的纹理整体地替换为2张分辨率为4096px*4096px的正方形图形的动作，渲染这2张分辨率为4096px*4096px的正方形图形。在该过程中，仅需要存储一张全景图(例如，2张分辨率为4096px*4096px的图形)。虽然这张全景图的分辨率较高，但由于通过多个线程的方式同步对其进行加载，故加载时间可极大地减少，从而可相应地压缩天空盒的可视时间，使用户在较短的时间内就能够观察到全景图。
综上所述，本发明实施例创造性地在检测到用于渲染目标图形的系统内存较大的情况下，响应于根据所述图形加载方法将具有第一预设分辨率的第一预设数目个图形设置为天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形，然后响应于将所述天空盒的纹理渐进地替换为具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。由此，本发明可极大地压缩天空盒的可视时间，并在用户的浏览过程中无感知地使全景图逐渐从模糊变得清晰，从而可极大地提高用户的体验和留存率。
本发明一实施例还提供一种图形加载系统，所述图形加载系统包括：服务器，用于对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，其中，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；第一加载器，用于从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形；第一检测装置，用于检测用于渲染所述目标图形的系统内存的大小；以及第一替换装置，用于在所述系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形，其中，所述第三预设分辨率大于所述第二预设分辨率。
优选地，所述替换装置包括：绘制模块，用于将所述第一预设数目个图形进行等倍数放大，并将放大后的所述第一预设数目个图形绘制在所述2D画布上，其中，所述第一预设数目个图形的总尺寸等于所述目标图形的尺寸；设置模块，用于将所述2D画布设置为所述天空盒的纹理，以继续渲染所述目标图形；排序模块，用于按照所述第二预设数目个图形在所述目标图形中的位置，对所述第二预设数目个图形进行排序；第二加载器，用于从所述服务器上加载所述第二预设数目个图形中的与所述天空盒的主视角覆盖区域相对应的第一组图形，并将所述第一组图形绘制在所述2D画布的相应位置上，其中，所述第二预设数目个图形包括：所述第一组图形与第二组图形；以及第三加载器，用于以所述第一组图形的垂直方向上的对称轴为中心，按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形，并按照所述第一预设规则将所述第二组图形绘制在所述2D画布的相应位置上。
优选地，所述第一加载器包括：第一加载模块，用于以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的非最顶层图形及非最底层图形进行加载；以及第二加载模块，用于以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的最顶层图形及最底层图形进行加载。
优选地，在所述天空盒的形状为球体的情况下，所述第一预设数目个图形为两个图形，相应地，所述图形加载系统还包括：第二检测装置，用于检测用于切换至不同视角的滑动动作；暂停装置，用于在检测到所述滑动动作的情况下，暂停针对所述第二预设数目个图形的加载动作，并记录当前正在加载的图形及所述第二预设数目个图形中的未被加载的图形，其中，所述未被加载的图形包括：第三组图形，该第三组图形包括与所述天空盒的不同视角的预设覆盖区域相对应的图形中的未被加载的图形；及第四组图形，该第四组图形包括所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域相对应的图形中的未被加载的图形；第二替换装置，用于根据所述滑动动作，采用所述第二加载方式及所述2D画布，将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形；以及第三替换装置，用于从所述当前正在加载的图形开始，采用所述第一加载方式及所述2D画布，将所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域的纹理渐进地替换为所述第四组图形。
优选地，所述第二替换装置包括：矢量确定模块，用于确定所述滑动动作对应的滑动起点及滑动矢量；特定图形确定模块，用于确定与所述滑动起点相对应的所述第二预设数目个图形中的特定图形，其中，所述特定图形已被加载；以及第四加载器，用于以所述特定图形为起点且沿所述滑动矢量的方向，按照第二预设规则从所述服务器上依次加载所述第三组图形，并将所述第三组图形绘制在所述2D画布的相应位置上。
优选地，所述第四加载器包括：扫描模块，用于采用预设覆盖区域为扫描单位，将所述扫描单位的中心从所述特定图形开始且沿所述滑动矢量的方向对所述第二预设数目个图形进行扫描，直至所述扫描单位的中心遇到达到最顶层图形、最底层图形或已被加载的图形所述第二特定图形中的任一者；以及第三加载模块，用于按照扫描的先后顺序对扫描到的所述第三组图形进行加载，并将所加载的所述第三组图形绘制在所述2D画布的相应位置上。
优选地，所述服务器还用于，对所述目标图形进行预处理，以形成具有第四预设分辨率的第一预设数目个图形，其中，所述第三预设分辨率大于或等于所述第四预设分辨率，且所述第四预设分辨率大于所述第二预设分辨率，相应地，所述图形加载系统还包括：第五加载器，用于在所述系统内存的大小小于或等于所述预设值的情况下，采用第三加载方式，将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形，以采用所述第四预设分辨率重新渲染所述目标图形。
优选地，所述第五加载器包括：第四加载模块，用于通过多个线程从所述服务器上加载所述具有第四预设分辨率的第一预设数目个图形，以获取所述具有第四预设分辨率的第一预设数目个图形的加载数据；拼接模块，用于将所述加载数据拼接成所述具有第四预设分辨率的第一预设数目个图形；以及替换模块，用于将所述天空盒的纹理替换为拼接成的所述具有第四预设分辨率的第一预设数目个图形，以采用所述第三预设分辨率重新渲染所述目标图形。
有关本发明提供的图形加载系统的具体细节及益处可参阅上述针对图形加载方法的描述，于此不再赘述。
本发明一实施例还提供一种图形渲染系统，所述图形渲染系统包括：检测装置，用于检测用于加载目标图形的系统内存的大小，其中，所述目标图形由所述的图形加载系统被预处理成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；第一渲染装置，用于在所述系统内存的大小大于预设值的情况下，响应于根据所述图形加载系统将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形；以及第二渲染装置，用于响应于根据所述图形加载系统将所述天空盒的纹理渐进地替换为所述具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。
在所述目标图形由所述的图形加载系统被预处理成具有第四预设分辨率的第一预设数目个图形的情况下，所述图形渲染系统还包括：第三渲染装置，用于在所述系统内存的大小小于或等于所述预设值的情况下，响应于根据所述图形加载系统将所述天空盒的纹理整体地替换为所述具有第四预设分辨率的第一预设数目个图形的动作，渲染所述具有第四预设分辨率的第一预设数目个图形。
有关本发明提供的图形渲染系统的具体细节及益处可参阅上述针对图形渲染方法的描述，于此不再赘述。
本发明一实施例还提供一种机器可读存储介质，所述机器可读存储介质上存储有指令，该指令用于使得机器执行上述的图形加载方法及根据所述的图形渲染方法。
本发明一实施例还提供一种电子设备，其特征在于，所述电子设备包括：处理器；用于存储所述处理器可执行指令的存储器；所述处理器，用于从所述存储器中读取所述可执行指令，并执行所述指令以实现所述的图形加载方法及根据所述的图形渲染方法。
以上结合附图详细描述了本发明实施例的可选实施方式，但是，本发明实施例并不限于上述实施方式中的具体细节，在本发明实施例的技术构思范围内，可以对本发明实施例的技术方案进行多种简单变型，这些简单变型均属于本发明实施例的保护范围。
另外需要说明的是，在上述具体实施方式中所描述的各个具体技术特征，在不矛盾的情况下，可以通过任何合适的方式进行组合。为了避免不必要的重复，本发明实施例对各种可能的组合方式不再另行说明。
本领域技术人员可以理解实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，该程序存储在一个存储介质中，包括若干指令用以使得单片机、芯片或处理器(processor)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。
此外，本发明实施例的各种不同的实施方式之间也可以进行任意组合，只要其不违背本发明实施例的思想，其同样应当视为本发明实施例所公开的内容。

Claims (10)

1.一种图形加载方法，其特征在于，所述图形加载方法包括：
通过服务器对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，其中，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；
从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形；
检测用于渲染所述目标图形的系统内存的大小；以及
在所述系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形，其中，所述第三预设分辨率大于所述第二预设分辨率。
2.根据权利要求1所述的图形加载方法，其特征在于，所述将所述天空盒的纹理渐进地替换为所述第二预设数目个图形包括：
将所述第一预设数目个图形进行等倍数放大，并将放大后的所述第一预设数目个图形绘制在所述2D画布上，其中，所述第一预设数目个图形的总尺寸等于所述目标图形的尺寸；
将所述2D画布设置为所述天空盒的纹理，以继续渲染所述目标图形；
按照所述第二预设数目个图形在所述目标图形中的位置，对所述第二预设数目个图形进行排序；
从所述服务器上加载所述第二预设数目个图形中的与所述天空盒的主视角覆盖区域相对应的第一组图形，并将所述第一组图形绘制在所述2D画布的相应位置上，其中，所述第二预设数目个图形包括：所述第一组图形与第二组图形；以及
以所述第一组图形的垂直方向上的对称轴为中心，按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形，并按照所述第一预设规则将所述第二组图形绘制在所述2D画布的相应位置上。
3.根据权利要求2所述的图形加载方法，其特征在于，所述按照第一预设规则从所述服务器上依次加载所述第二预设数目个图形中的所述第二组图形包括：
以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的非最顶层图形及非最底层图形进行加载；以及
以所述对称轴为中心，沿水平方向往两侧逐渐展开的方式对所述第二组图形中的最顶层图形及最底层图形进行加载。
4.根据权利要求2所述的图形加载方法，其特征在于，在所述天空盒的形状为球体的情况下，所述第一预设数目个图形为两个图形，
相应地，在执行所述将所述天空盒的纹理渐进地替换为所述第二预设数目个图形的步骤的过程中，所述图形加载方法还包括：
检测用于切换至不同视角的滑动动作；
在检测到所述滑动动作的情况下，暂停针对所述第二预设数目个图形的加载动作，并记录当前正在加载的图形及所述第二预设数目个图形中的未被加载的图形，其中，所述未被加载的图形包括：第三组图形，该第三组图形包括与所述天空盒的不同视角的预设覆盖区域相对应的图形中的未被加载的图形；及第四组图形，该第四组图形包括与所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域相对应的图形中的未被加载的图形；
根据所述滑动动作，采用所述第二加载方式及所述2D画布，将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形；以及
从所述当前正在加载的图形开始，采用所述第一加载方式及所述2D画布，将所述天空盒的除了所述不同视角与所述主视角之外的视角的覆盖区域的纹理渐进地替换为所述第四组图形。
5.根据权利要求4所述的图形加载方法，其特征在于，所述将所述天空盒的不同视角的预设覆盖区域的纹理渐进地替换为所述第三组图形包括：
确定所述滑动动作对应的滑动起点及滑动矢量；
确定与所述滑动起点相对应的所述第二预设数目个图形中的特定图形，其中，所述特定图形已被加载；以及
以所述特定图形为起点且沿所述滑动矢量的方向，按照第二预设规则从所述服务器上依次加载所述第三组图形，并将所述第三组图形绘制在所述2D画布的相应位置上。
6.一种图形渲染方法，其特征在于，所述图形渲染方法包括：
检测用于渲染目标图形的系统内存的大小，其中，所述目标图形根据权利要求1-5中任一项所述的图形加载方法被预处理成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；
在所述系统内存的大小大于预设值的情况下，响应于根据所述图形加载方法将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形；以及
响应于根据所述图形加载方法将所述天空盒的纹理渐进地替换为所述具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。
7.一种图形加载系统，其特征在于，所述图形加载系统包括：
服务器，用于对目标图形进行预处理，以形成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，其中，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；
第一加载器，用于从所述服务器上加载所述具有第一预设分辨率的第一预设数目个图形，并将所述第一预设数目个图形设置为所述天空盒的纹理，以采用所述第二预设分辨率渲染所述目标图形；
第一检测装置，用于检测用于渲染所述目标图形的系统内存的大小；以及
第一替换装置，用于在所述系统内存的大小大于预设值的情况下，采用第一加载方式及具有第三预设分辨率的2D画布，将所述天空盒的纹理渐进地替换为所述第二预设数目个图形，以采用所述第二预设分辨率重新渲染所述目标图形，其中，所述第三预设分辨率大于所述第二预设分辨率。
8.一种图形渲染系统，其特征在于，所述图形渲染系统包括：
检测装置，用于检测用于加载目标图形的系统内存的大小，其中，所述目标图形由权利要求7所述的图形加载系统被预处理成具有第一预设分辨率的第一预设数目个图形及具有第二预设分辨率的第二预设数目个图形，所述第一预设分辨率大于所述第二预设分辨率，所述第一预设数目与天空盒的形状相匹配，以及所述第二预设数目是所述第一预设数目的两倍以上的整数倍；
第一渲染装置，用于在所述系统内存的大小大于预设值的情况下，响应于根据所述图形加载系统将所述具有第一预设分辨率的第一预设数目个图形设置为所述天空盒的纹理的动作，渲染所述具有第一预设分辨率的第一预设数目个图形；以及
第二渲染装置，用于响应于根据所述图形加载系统将所述天空盒的纹理渐进地替换为所述具有第二预设分辨率的第二预设数目个图形的动作，渲染所述第二预设数目个图形。
9.一种机器可读存储介质，其特征在于，所述机器可读存储介质上存储有指令，该指令用于使得机器执行上述权利要求1-5中任一项权利要求所述的图形加载方法及根据权利要求6所述的图形渲染方法。
10.一种电子设备，其特征在于，所述电子设备包括：
处理器；
用于存储所述处理器可执行指令的存储器；
所述处理器，用于从所述存储器中读取所述可执行指令，并执行所述指令以实现上述权利要求1-5中任一项权利要求所述的图形加载方法及根据权利要求6所述的图形渲染方法。
CN202110326782.8A 2021-03-26 2021-03-26 图形加载方法与系统以及图形渲染方法与系统 Active CN112905293B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110326782.8A CN112905293B (zh) 2021-03-26 2021-03-26 图形加载方法与系统以及图形渲染方法与系统

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110326782.8A CN112905293B (zh) 2021-03-26 2021-03-26 图形加载方法与系统以及图形渲染方法与系统

Publications (2)

Publication Number Publication Date
CN112905293A true CN112905293A (zh) 2021-06-04
CN112905293B CN112905293B (zh) 2023-07-07

Family

ID=76108848

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110326782.8A Active CN112905293B (zh) 2021-03-26 2021-03-26 图形加载方法与系统以及图形渲染方法与系统

Country Status (1)

Country Link
CN (1) CN112905293B (zh)

Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6522336B1 (en) * 1997-10-31 2003-02-18 Hewlett-Packard Company Three-dimensional graphics rendering apparatus and method
US20170330496A1 (en) * 2016-05-16 2017-11-16 Unity IPR ApS System and method for rendering images in virtual reality and mixed reality devices
CN107527322A (zh) * 2017-09-27 2017-12-29 杭州群核信息技术有限公司 渲染方法、装置、引擎及存储介质
CN107680042A (zh) * 2017-09-27 2018-02-09 杭州群核信息技术有限公司 渲染方法、装置、引擎及存储介质
CN110223228A (zh) * 2019-05-16 2019-09-10 北京奇艺世纪科技有限公司 图像处理方法、装置、终端设备及存储介质
CN112184877A (zh) * 2020-09-30 2021-01-05 杭州电魂网络科技股份有限公司 辉光效果的渲染优化的方法和系统
CN112233009A (zh) * 2020-10-13 2021-01-15 广州南方卫星导航仪器有限公司 一种图片渲染方法、装置、设备和存储介质
CN112465939A (zh) * 2020-11-25 2021-03-09 上海哔哩哔哩科技有限公司 全景视频渲染方法及系统

Patent Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6522336B1 (en) * 1997-10-31 2003-02-18 Hewlett-Packard Company Three-dimensional graphics rendering apparatus and method
US20170330496A1 (en) * 2016-05-16 2017-11-16 Unity IPR ApS System and method for rendering images in virtual reality and mixed reality devices
CN107527322A (zh) * 2017-09-27 2017-12-29 杭州群核信息技术有限公司 渲染方法、装置、引擎及存储介质
CN107680042A (zh) * 2017-09-27 2018-02-09 杭州群核信息技术有限公司 渲染方法、装置、引擎及存储介质
CN110223228A (zh) * 2019-05-16 2019-09-10 北京奇艺世纪科技有限公司 图像处理方法、装置、终端设备及存储介质
CN112184877A (zh) * 2020-09-30 2021-01-05 杭州电魂网络科技股份有限公司 辉光效果的渲染优化的方法和系统
CN112233009A (zh) * 2020-10-13 2021-01-15 广州南方卫星导航仪器有限公司 一种图片渲染方法、装置、设备和存储介质
CN112465939A (zh) * 2020-11-25 2021-03-09 上海哔哩哔哩科技有限公司 全景视频渲染方法及系统

Also Published As

Publication number Publication date
CN112905293B (zh) 2023-07-07

Similar Documents

Publication Publication Date Title
EP2464093B1 (en) Image file generation device, image processing device, image file generation method, and image processing method
US11676253B2 (en) Systems, methods, and media for hierarchical progressive point cloud rendering
US20160071235A1 (en) Image processing device for displaying moving image and image processing method thereof
US8878869B2 (en) Image processing device and image processing method
JP7271099B2 (ja) ファイルの生成装置およびファイルに基づく映像の生成装置
CN110956673A (zh) 一种地图绘制方法及装置
WO2016181202A1 (en) Generation, transmission and rendering of virtual reality multimedia
US20090244066A1 (en) Multi parallax image generation apparatus and method
US9013479B2 (en) Apparatus and method for tile-based rendering
US20130188862A1 (en) Method and arrangement for censoring content in images
JP2013135463A (ja) 動画圧縮装置、画像処理装置、動画圧縮方法、画像処理方法、および動画圧縮ファイルのデータ構造
CN109074677B (zh) 用于处理图像的方法和设备
EP3509300A1 (en) Panoramic video compression method and device
CN111228801A (zh) 游戏场景的渲染方法和装置、存储介质、处理器
JP2020173529A (ja) 情報処理装置、情報処理方法、及びプログラム
US11893705B2 (en) Reference image generation apparatus, display image generation apparatus, reference image generation method, and display image generation method
CN112650460B (zh) 媒体显示方法和媒体显示装置
US6230167B1 (en) Method and apparatus for generating and displaying hotlinks in a panoramic three dimensional scene
CN111640191B (zh) 基于vr一体机的投录屏画面采集处理方法
CN112905293B (zh) 图形加载方法与系统以及图形渲染方法与系统
CN114556433A (zh) 信息处理装置、3d数据生成方法及程序
JP6947939B2 (ja) 画像生成装置、画像生成方法及びプログラム
CN105204727A (zh) 一种图片呈现方法及装置
CN103442295A (zh) 一种在图片中播放视频的方法及装置
KR100270140B1 (ko) 파노라마식 3차원 경치에 핫링크를 발생하여 표시하는 방법 및 장치.

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
TA01 Transfer of patent application right

Effective date of registration: 20220519

Address after: 100085 Floor 101 102-1, No. 35 Building, No. 2 Hospital, Xierqi West Road, Haidian District, Beijing

Applicant after: Seashell Housing (Beijing) Technology Co.,Ltd.

Address before: 101309 room 24, 62 Farm Road, Erjie village, Yangzhen, Shunyi District, Beijing

Applicant before: Beijing fangjianghu Technology Co.,Ltd.

TA01 Transfer of patent application right
GR01 Patent grant
GR01 Patent grant