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

技术编号:33532848 阅读:27 留言:0更新日期:2022-05-19 02:07
本申请公开了一种基于WebGPU的渲染方法、电子终端及存储介质。本申请实施例提供的技术方案,在透视投影渲染过程中,针对当前视角可视范围内待渲染的至少一个物体模型,按照物体模型上各三角面和当前漫游点位之间的相对距离由远及近的顺序,为物体模型上各三角面分配深度值,由此可使近处和远处的三角面都能够分配到合理的深度值,避免因为分配不到合适的深度值而引起的z

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


[0001]本申请涉及互联网
,尤其涉及一种基于WebGPU的渲染方法、电子终端及存储介质。

技术介绍

[0002]目前,透视投影技术已应用于基于房屋三维空间的家装模拟场景中,通过透视投影技术可以将家装模拟场景中的墙面、家具、家电等物体的三维视图坐标变换为可以在屏幕上描绘出来的二维屏幕坐标,得到透视投影矩阵,进而由OpenGL或WebGL基于透视投影矩阵将这些物体渲染至家装界面中。在OpenGL或WebGL基于透视投影矩阵渲染一些距离视点较远的物体时,可能会出现深度冲突(z

fighting)现象,z

fighting现象是指同一物体或不同物体之间的两个三角面比较接近,因为无法得到足以区分这两个三角面的深度值而引起这两个三角面不断地切换前后顺序导致在界面上产生闪烁或抖动的现象,z

fighting现象会严重降低渲染质量。

技术实现思路

[0003]为解决或改善现有技术中存在的问题,本专利技术各实施例提供了一种基于We本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于WebGPU的渲染方法,通过电子终端提供图形用户界面,所述图形用户界面上显示有与目标物理空间对应的三维实景空间,其特征在于,所述方法包括:根据用户在所述三维实景空间中漫游和/或扫视的视角变化信息,获取当前视角可视范围内待渲染的至少一个物体模型,所述视角变化信息包括漫游点位变化信息、漫游视线方向变化信息、漫游视角角度变化信息中的至少一种,所述物体模型包括多个三角面,每个三角面具有纹理数据;根据当前视角对应的当前漫游点位和所述至少一个物体模型在所述三维实景空间中的位姿信息,计算所述至少一个物体模型上各三角面和所述当前漫游点位之间的相对距离;按照所述相对距离由远及近的顺序,依次从所述电子终端所支持的固定数量的深度值中为所述至少一个物体模型上各三角面分配深度值;根据所述至少一个物体模型上各三角面的纹理数据和深度值,利用WebGPU将所述至少一个物体模型渲染至所述图形用户界面上。2.根据权利要求1所述的方法,其特征在于,按照所述相对距离由远及近的顺序,依次从所述电子终端所支持的固定数量的深度值中为所述至少一个物体模型上各三角面分配深度值,包括:按照所述相对距离由远及近的顺序,以深度值均匀或近似均匀分配为目标,依次从所述电子终端所支持的固定数量的深度值中为所述至少一个物体模型上各三角面分配深度值。3.根据权利要求2所述的方法,其特征在于,按照所述相对距离由远及近的顺序,以深度值均匀或近似均匀分配为目标,依次从所述电子终端所支持的固定数量的深度值中为所述至少一个物体模型上各三角面分配深度值,包括:获取一上凸函数,利用所述上凸函数对已有用于深度值分配的下凸函数进行平衡处理,得到平衡后的深度值分配函数,所述平衡后的深度值分配函数是以所述相对距离为输入且以输出所述电子终端所支持的任一深度值为目标的函数;根据所述相对距离由远及近的顺序,依次将所述相对距离输入所述平衡后的深度值分配函数,以为所述至少一个物体模型上各三角面分配深度值。4.根据权利要求1所述的方法,其特征在于,根据所述至少一个物体模型上各三角面的纹理数据和深度值,利用WebGPU将所述至少一个物体模型渲染至所述图形用户界面上,包括:根据所述至少一个物体模型上各三角面的纹理数据和深度值,构建与每个物体模型适配的可计算着色器,并确定每个所述可计算着色器的网格大小和线程组数量;根据所述网格大小和线程组数量,调用WebGPU运行与每个物体模型适配的可计算着色器,以按照所述至少一个物体模型之间的相对位置关系将所述至少一个物体模型渲染至所述图形用户界面上。5.根据权利要求1所述的方法,其特征在于,所述三维实景空间是对所述目标物理空间进行建模得到的三维空间模型,所述至少一个物体模型包括当前视角可视范围内待渲染的家具模型和/或所述目标物理空间的局部结构模型,所述目标物理空间的局部结构模型包括所述目标物理空间中的墙面模型、地面模型或吊顶模型。
6.根据权利要求1所述的方法,其特征在于,所述三维实景空间是与所述目标物理空间对应的实景空间模型,所述方法还包括:利用激光雷达采集目标物理空间的点云数据,并利用摄像头拍摄所述目标物理空间的实景图像;根据所述点云数据构建与所述目标物理空间对应的中间态模型,并利用所述实景图像对所述中间态模型进行贴图处理,得到所述实景空间模型;以及响应用户发起的展示操作,将所述实景空间模型渲染至所述图形用户界面上,得到所述三维实景空间。7.根据权利要求6所述的方法,其特征在于,将所述实景空间模型渲染至所述图形用户界面上,包括:根据所述实景空间模型上各三角面的纹理数据,对所述实景空间模型进行分割,得到多个子模型,每个子模型包括多个三角面,每个三角面具有纹理数据;根据用户在所述实景空间模型中漫游和/或扫视的视角变化信息,获取当前视角可见范围内的子模型作为待渲染的目标子模型;根据所述目标子模型上各三角面的纹理数据,利用WebGPU将所述目标子模型渲染至所述图形用户界面上。8.根据权利要求7所述的方法,其特征在于,根据所述目标子模型上各三角面的纹理数据,利用WebGPU将...

【专利技术属性】
技术研发人员:ꢀ七四专利代理机构
申请(专利权)人:北京城市网邻信息技术有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1