基于WebGL的模型渲染方法、电子设备及存储介质技术

本申请公开了一种基于WebGL的模型渲染方法、电子设备及存储介质。本申请各实施例提供的技术方案，从待渲染目标模型对应的原始模型数据中选择由渲染纹理相同或相似且可形成目标模型上的连续区域的三角面，作为待优化三角面；进一步，从待优化三角面中选择至少一组包括相邻且彼此法线方向之间的夹角均小于设定角度阈值的至少两个三角面作为待优化的三角面组，可以降低同组中至少两个三角面的差异，加快优化效率；然后将该组三角面重新绘制成数量少于该组三角面数量的新三角面，得到优化后的模型，与原始模型相比，优化后的模型三角面减少，从而减少了渲染负载；再利用WebGL对优化后的模型数据进行渲染，可以提高渲染交互效率。率。率。

【技术实现步骤摘要】
基于WebGL的模型渲染方法、电子设备及存储介质


[0001]本申请涉及模型渲染领域，尤其涉及一种基于WebGL的模型渲染方法、电子设备及存储介质。

技术介绍

[0002]随着虚拟现实(Virtual Reality，VR)技术的发展，虚拟现实技术目前已广泛应用于基于三维空间的一些应用场景，例如在线装修中。在线装修场景中，根据后端提供的墙面和地面等数据在前端绘制在线装修三维场景，在在线装修三维场景中，为了更加真实地向用户展示装修效果图，需要对房梁、墙面以及房屋内的各种家居对象等进行模型渲染和呈现。
[0003]但是现有技术中，在模型渲染时，模型都是由顶点和三角面组成的，如果描述模型的三角面比较多，渲染负载较大，渲染交互效率较低。

技术实现思路

[0004]为解决或改善现有技术中存在的问题，本申请各实施例提供了一种基于WebGL的模型渲染方法、电子设备及存储介质。
[0005]在本申请的一个实施例中，提供了一种基于WebGL的模型渲染方法。该方法，包括：
[0006]获取待渲染目标模型对应的原始模型数据，所本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于WebGL的模型渲染方法，其特征在于，包括：获取待渲染目标模型对应的原始模型数据，所述原始模型数据包括所述目标模型所需的多个顶点、由所述多个顶点形成的多个三角面和每个三角面使用的渲染纹理；根据每个三角面使用的渲染纹理，从所述多个三角面中选择由渲染纹理相同或相似且可形成所述目标模型上的连续区域的三角面，作为待优化三角面；根据所述待优化三角面中相邻三角面的法线方向之间的夹角，从所述待优化三角面中选择至少一组三角面，每一组中包括相邻且彼此法线方向之间的夹角均小于设定角度阈值的至少两个三角面；针对每一组三角面，将该组三角面重新绘制成数量少于该组三角面数量的新三角面，得到优化后的模型数据，并利用WebGL对所述优化后的模型数据进行渲染，得到所述目标模型；其中，根据所述优化后的模型数据渲染出的目标模型包括的顶点数量和三角面数量均少于根据所述原始模型数据渲染出的目标模型的顶点数量和三角面数量。2.根据权利要求1所述的方法，其特征在于，根据每个三角面使用的渲染纹理，从所述多个三角面中选择由渲染纹理相同或相似且可形成所述目标模型上的连续区域的三角面，作为待优化三角面，包括：根据每个三角面的顶点坐标，获取由所述多个三角面形成所述目标模型时的所述目标模型中的边缘区域，并根据每个三角面的法线方向，获取由所述多个三角面形成的所述目标模型中的弯曲区域；根据每个三角面的渲染纹理，从所述边缘区域和所述弯曲区域中选择渲染纹理相同或相似的三角面，作为待优化三角面。3.根据权利要求2所述的方法，其特征在于，根据每个三角面的顶点坐标，获取由所述多个三角面形成所述目标模型时的所述目标模型中的边缘区域，包括：判断每个三角面的顶点坐标中是否出现坐标极值；从顶点坐标中出现坐标极值的三角面中，获取顶点坐标中出现同一坐标极值的三角面；所述顶点坐标中出现同一坐标极值的三角面形成所述目标模型中的边缘区域。4.根据权利要求2所述的方法，其特征在于，根据每个三角面的法线方向，获取由所述多个三角面形成的所述目标模型中的弯曲区域，包括：根据每个三角面的法线方向，判断所述目标模型中是否存在法线方向呈现均匀或近似均匀变化趋势的连续多个三角面；若存在，将所述连续多个三角面形成的区域作为所述目标模型中的弯曲区域。5.根据权利要求1
‑
4任一项所述的方法，其特征在于，针对每一组三角面，将该组三角面重新绘制成数量少于该组三角面数量的新三角面，包括：针对每一组三角面，将该组三角面的所有顶点映射到同一坐标平面内，得到该组三角面对应的一组二维顶点坐标；从该组二维顶点坐标中，选择位于所述同一坐标平面上最外层的至少三个二维顶点坐标；从该组三角面的所有顶点中，确定与所述至少三个...

【专利技术属性】
技术研发人员：高佩文，
申请(专利权)人：北京城市网邻信息技术有限公司，
类型：发明
国别省市：