CN114329274A - 基于产业应用的WebVR应用方法 - Google Patents

Abstract

本申请公开了一种基于产业应用的WebVR应用方法，属于虚拟现实技术领域，针对现有技术中WebVR应用因数据冗余、调度策略等引起的性能不足和体验感差的难题。对模型的网格和贴图文件进行优化，使用LWRP渲染管线自定义渲染管线，大大节省模型占用内存，使得渲染效率提升了30％；使用轻量级WebGL引擎和Three.JS进行开发，克服了之前的WebVR应用对浏览器插件的依赖，使得应用可在不同浏览器进行自由部署，提高了应用的可访问性和安全性；使用AssetBundle管理资源方式对资源进行打包、动态加载和卸载，提高了后期的维护效率。

Description

基于产业应用的WebVR应用方法

技术领域

本发明涉及一种基于产业应用的WebVR应用方法，属于虚拟现实领域。

背景技术

5G网络的发展使得虚拟现实(Virtual Reality,VR)和增强现实技术(AugmentedReality,AR)受到了越来越多领域的关注,WebVR是一种特殊的VR体验形式，其将VR体验搬进了浏览器，用户通过浏览器就能够获得完整的VR体验，不仅降低了VR的体验门槛，同时也扩展了VR的使用环境和使用范围。

常见的WebVR应用在场景模型创建上分为两种：一种是照片全景模式实，将拍摄的360度实景照片拼接成的一个全景展示图像，观察者站在原地可360度观看，这种虚拟场景的观察点是预置好的，不可随便移动；另一种是使用3D建模，使用3D Max或Maya等建模工具创建3D场景和3D模型，用户可进行全景无死角漫游，并可对场景中任意3D模型的单独操作。

目前的3D建模仅考虑美术效果，不考虑性能表现，而WebVR应用需要通过网络传输模型文件，复杂模型和冗余的数据会导致网络传输出现延迟和卡顿，进而影响用户体验感，这使得规模大小和渲染效果受到很大的限制，并且WebVR应用因调度策略等问题，还会引起性能不足和体验感差等问题。

发明内容

本发明提供一种基于产业应用的WebVR应用方法，优化场景模型，去除冗余数据，使WebVR应用可以流畅运行，同时提升场景渲染的视觉效果，提升使用者的体验感。

本发明采取的技术方案是，一种基于产业应用的WebVR应用方法，包括以下步骤：

1)使用3DStudioMax创建三维模型；

2)将步骤1)创建的三维模型导入Unity3D编辑器中，使用Unity3D编辑器创建虚拟场景及UI；

3)使用Unity3D编辑器对步骤2)建立的虚拟场景进行材质处理、灯光设置和烘焙；

4)使用Unity3D编辑器，以C语言编写虚拟场景的交互程序，完成虚拟场景中对象间交互功能以及数据存储、访问；

5)将步骤3)完成后的虚拟场景、步骤4)完成后交互程序以WebGL格式发布并部署至Web服务器；

在步骤3)中，使用自我管理引用的方法，在编辑器模式下存储纹理文件及其与预制体表现材质之间的引用关系。

优化的，上述基于产业应用的WebVR应用方法，使用自我管理引用的方法，在编辑器模式下存储纹理文件及其与预制体表现材质之间的引用关系，其包括以下步骤：

3-1)将预制体表现材质所使用的纹理信息保存到PropertiesName和PropertiesTextureName两个变量中；将变量名打包到Bundle中，且变量名在重新解开Bundle的时候得到；

3-2)在加载出纹理文件后，建立纹理名字与纹理文件的关系表，并建立纹理的查找表Texture2DBundlerCache；通过纹理名字对纹理进行添加、查找、删除等操作；

3-3)修改预制体表现材质代码；当预制体表现材质不使用时，切断预制体表现材质与纹理的引用关系并将新生成的纹理文件删除；在预制体表现材质使用时，重新将预制体表现材质与纹理的引用关系恢复。

优化的，上述基于产业应用的WebVR应用方法，针对三维模型的网格数据，使用glTF配合Draco压缩的方式进行优化；针对三维模型的模型贴图，将png文件转换为basis文件。

优化的，上述基于产业应用的WebVR应用方法，在步骤3)中，对虚拟场景使用LWRP渲染管线进行渲染，并对LWRP渲染管线中的渲染代码做出改进，具体改进为：在没有特效、不需要刷新的界面中，复用之前的渲染效果；只在有点击事件、滑动事件、特效需要刷新的事件时，对界面的渲染效果进行更新。

优化的，上述基于产业应用的WebVR应用方法，在步骤5)完成后，通过WebGL调用用户终端设备的GPU进行渲染操作；unity3D编辑器中通过脚本将所需要的资源打包成AssetBundle文件上传至服务器中。

优化的，上述基于产业应用的WebVR应用方法，步骤5)完成后，使用GUI的方式进行数据交互，使用文字标签、输入域和按钮等控件构成的GUI作为体验者身份验证和信息维护的方式，通过事件监听方法与数据进行交互；采用MVC模式将前端界面通过控制器与后端的数据处理分离；

步骤5)完成后，定义射线方式完成体验者与模型和按钮的互动,通过鼠标单击发射射线，如果交互目标被击中，则进行互动。

优化的，上述基于产业应用的WebVR应用方法，体验者的数据以JSON格式的数据文件存储，并将数据导入到非关系型数据库Mongo数据库中，其具体过程为：

6-1)为每个体验者设立一个账号，生成一个“用户名.json”格式的数据文件，数据文件采用键值对进行记录；

6-2)创建用户实体UserData，在前端的GUI中获取数据，并通过UserData实例化对象传递数据，对.json文件进行读写操作；

6-3)使用C语言内置的I/O类库、File和FileStream及JsonUtility类库进行文件读写；读取数据时，将json字符串转成UserData对象；保存数据时，则将UserData对象转成json字符串。

本申请的有益效果在于：

本申请的技术方案，克服WebVR应用对浏览器插件的依赖，提高应用的可访问性和安全性；优化场景模型，去除冗余数据，使WebVR应用可以流畅运行，同时提升场景渲染的视觉效果，提升使用者的体验感；对内容管理实现可动态加载，提高后期维护的效率。

本申请的技术方案中，对模型的网格和贴图文件进行优化，使用LWRP渲染管线自定义渲染管线，大大节省模型占用内存，使得渲染效率提升了30％；使用轻量级Web GL引擎和Three.JS进行开发，克服了之前的WebVR应用对浏览器插件的依赖，使得应用可在不同浏览器进行自由部署，提高了应用的可访问性和安全性；最后使用AssetBundle管理资源方式对资源进行打包、动态加载和卸载，提高了后期的维护效率。

附图说明

图1为本申请的基于产业应用的WebVR应用方法的硬件架构示意图；

图2为本申请的基于产业应用的WebVR应用方法的操作流程图；

图3为本申请的基于产业应用的WebVR应用方法的应用构建流程图。

具体实施方式

下面结合附图与具体实施例进一步阐述本发明的技术特点。

此实施例公开了一种基于产业应用的WebVR应用方法，其基于如图1所示的硬件架构实现。此实施例的WebVR应用的硬件架构包括Web服务器、数据库服务器和客户机。将应用发布为WebGL(Web Graphics Library)格式并部署到服务器端，体验者通过客户端的浏览器可实现访问和体验。

本应用使用3D Studio Max(3ds Max)创建三维模型并导入Unity3D(U3D)编辑器中，U3D作为主开发平台创建GUI和应用虚拟场景，完成渲染和烘焙，并通过使用C#编程语言编写交互程序，完成对象间交互功能以及数据存储和访问，最后将应用程序发布到服务器端，应用的构建流程如图3所示。此实施例的基于产业应用的WebVR应用方法，包括以下步骤：

1)使用3DStudioMax创建三维模型；

2)将步骤1)创建的三维模型导入Unity3D编辑器中，使用Unity3D编辑器创建虚拟场景及UI；

3)使用Unity3D编辑器对步骤2)建立的虚拟场景进行材质处理、灯光设置和烘焙；

4)使用Unity3D编辑器，以C语言编写虚拟场景的交互程序，完成虚拟场景中对象间交互功能以及数据存储、访问；

5)将步骤3)完成后的虚拟场景、步骤4)完成后交互程序以WebGL格式发布并部署至Web服务器；

在步骤3)中，使用自我管理引用的方法，在编辑器模式下存储纹理文件及其与预制体表现材质之间的引用关系，其包括以下步骤：

3-1)将预制体表现材质所使用的纹理信息保存到PropertiesName和PropertiesTextureName两个变量中；将变量名打包到Bundle中，且变量名在重新解开Bundle的时候得到；

3-2)在加载出纹理文件后，建立纹理名字与纹理文件的关系表，并建立纹理的查找表Texture2DBundlerCache；通过纹理名字对纹理进行添加、查找、删除等操作；

3-3)修改预制体表现材质代码；当预制体表现材质不使用时，切断预制体表现材质与纹理的引用关系并将新生成的纹理文件删除；在预制体表现材质使用时，重新将预制体表现材质与纹理的引用关系恢复。

解决纹理文件冗余的主要原因在于：在打包过程中，若n个预制体使用同一个纹理，则打包时文件个数为n+1个(预制体文件数+纹理文件数)，虽然可加载出想要的资源，但内存中出现了数据冗余的现象，即预制体的纹理已经被加载出来且占用了内存，但是纹理文件的映射依然保存在内存中，一份数据出现了2份内存开销。若调用AssetBundle.UnLoad(false)释放掉纹理文件的映射内存，则对纹理文件有依赖的预制体文件无法正常显示，即预制体的材质纹理指向的是null。如果不释放纹理文件的映射内存，在加载完纹理文件后再加载其他的预制体，则内存中会出现两个同名的纹理文件的情况。

而在此实施例中使用的自我管理引用的方法，在编辑器模式下存储纹理文件及与预制体材质之间的引用关系。通过存储表实现材质与纹理之间的对应，减小了文件内存占用，使引用关系简单化。

针对三维模型的网格数据，使用glTF配合Draco压缩的方式进行优化，在视觉效果近乎一致的情况下，让3D模型文件成倍缩小，提高加载速度和渲染性能，在保证3D模型不减面，贴图不缩小的情况下，将模型精致还原。

针对三维模型的模型贴图，将png文件转换为basis文件。贴图资源文件大小对比png文件大大减小，同时主线程的脚本时间和绘制时间花销也小于png/jpg贴图。

在步骤3)中，对虚拟场景使用LWRP渲染管线进行渲染，对比以前的内置渲染管线，克服了向前渲染的多光源重复绘制问题，可基于应用场景自定义渲染管线，提高多光源绘制效率的同时提供更高质量的视觉体验。

对LWRP渲染管线中的渲染代码做出改进，具体改进为：在没有特效、不需要刷新的界面中，复用之前的渲染效果；只在有点击事件、滑动事件、特效需要刷新的事件时，对界面的渲染效果进行更新。减少一直渲染的时间，以此降低计算频率，实现只在有点击事件、滑动事件以及特效等需要刷新的事件时做更新。

在步骤5)完成后，通过WebGL调用用户终端设备的GPU进行渲染操作；WebGL具有良好的兼容性，几乎所有浏览器都原生支持WebGL。本实施例通过使用WebGL克服了WebVR应用对浏览器插件的依赖。同时通过WebGL调用用户终端设备的GPU进行渲染操作，使得3D场景渲染速度也得到提升。

unity3D编辑器中通过脚本将所需要的资源打包成AssetBundle文件上传至服务器中。使得用户端能够获取模型、纹理图、音频、动画、场景等资源，加载应用并做出及时更新。本实施例中使用小型AssetBundles进行资源的动态管理，与使用大型AssetBundles相比，避免了出现性能风险，提高了内存效率和后期维护效率。

步骤5)完成后，使用GUI的方式进行数据交互，主要包括体验者登录验证与其信息维护两部分。使用文字标签、输入域和按钮等控件构成的GUI作为体验者身份验证和信息维护的方式，通过事件监听方法与数据进行交互；采用MVC模式将前端界面通过控制器与后端的数据处理分离。采用MVC(模型-视图-控制器)模式较好地将前端界面通过控制器与后端的数据处理分离，便于代码的维护，节约时间和成本。

步骤5)完成后，定义射线方式完成体验者与模型和按钮的互动,通过鼠标单击发射射线，如果交互目标被击中，则进行互动。此处交互方式使用Ray和RaycastHit两个类中的方法，以及Physics.Raycast方法来实现。主要代码如下：

体验者的数据以JSON格式的数据文件存储，并将数据导入到非关系型数据库Mongo数据库中，其具体过程为：

6-1)为每个体验者设立一个账号，生成一个“用户名.json”格式的数据文件，数据文件采用键值对进行记录；

6-2)创建用户实体UserData，在前端的GUI中获取数据，并通过UserData实例化对象传递数据，对.json文件进行读写操作；

6-3)使用C语言内置的I/O类库、File和FileStream及JsonUtility类库进行文件读写；读取数据时，将json字符串转成UserData对象；保存数据时，则将UserData对象转成json字符串。

此过程中的主要代码如下：

当然，上述说明并非是对本发明的限制，本发明也并不限于上述举例，本技术领域的普通技术人员，在本发明的实质范围内，作出的变化、改型、添加或替换，都应属于本发明的保护范围。

Claims (7)

1.一种基于产业应用的WebVR应用方法，包括以下步骤：

1)使用3DStudioMax创建三维模型；

2)将步骤1)创建的三维模型导入Unity3D编辑器中，使用Unity3D编辑器创建虚拟场景及UI；

3)使用Unity3D编辑器对步骤2)建立的虚拟场景进行材质处理、灯光设置和烘焙；

4)使用Unity3D编辑器，以C语言编写虚拟场景的交互程序，完成虚拟场景中对象间交互功能以及数据存储、访问；

5)将步骤3)完成后的虚拟场景、步骤4)完成后交互程序以WebGL格式发布并部署至Web服务器；

其特征在于：在步骤3)中，使用自我管理引用的方法，在编辑器模式下存储纹理文件及其与预制体表现材质之间的引用关系。

2.根据权利要求1所述的基于产业应用的WebVR应用方法，其特征在于：使用自我管理引用的方法，在编辑器模式下存储纹理文件及其与预制体表现材质之间的引用关系，其包括以下步骤：

3-1)将预制体表现材质所使用的纹理信息保存到PropertiesName和PropertiesTextureName两个变量中；将变量名打包到Bundle中，且变量名在重新解开Bundle的时候得到；

3-2)在加载出纹理文件后，建立纹理名字与纹理文件的关系表，并建立纹理的查找表Texture2DBundlerCache；通过纹理名字对纹理进行添加、查找、删除等操作；

3-3)修改预制体表现材质代码；当预制体表现材质不使用时，切断预制体表现材质与纹理的引用关系并将新生成的纹理文件删除；在预制体表现材质使用时，重新将预制体表现材质与纹理的引用关系恢复。

3.根据权利要求1所述的基于产业应用的WebVR应用方法，其特征在于：针对三维模型的网格数据，使用glTF配合Draco压缩的方式进行优化；针对三维模型的模型贴图，将png文件转换为basis文件。

4.根据权利要求1所述的基于产业应用的WebVR应用方法，其特征在于：在步骤3)中，对虚拟场景使用LWRP渲染管线进行渲染，并对LWRP渲染管线中的渲染代码做出改进，具体改进为：在没有特效、不需要刷新的界面中，复用之前的渲染效果；只在有点击事件、滑动事件、特效需要刷新的事件时，对界面的渲染效果进行更新。

5.根据权利要求1所述的基于产业应用的WebVR应用方法，其特征在于：在步骤5)完成后，通过WebGL调用用户终端设备的GPU进行渲染操作；unity3D编辑器中通过脚本将所需要的资源打包成AssetBundle文件上传至服务器中。

6.根据权利要求1所述的基于产业应用的WebVR应用方法，其特征在于：步骤5)完成后，使用GUI的方式进行数据交互，使用文字标签、输入域和按钮等控件构成的GUI作为体验者身份验证和信息维护的方式，通过事件监听方法与数据进行交互；采用MVC模式将前端界面通过控制器与后端的数据处理分离；

步骤5)完成后，定义射线方式完成体验者与模型和按钮的互动,通过鼠标单击发射射线，如果交互目标被击中，则进行互动。

7.根据权利要求6所述的基于产业应用的WebVR应用方法，其特征在于：

体验者的数据以JSON格式的数据文件存储，并将数据导入到非关系型数据库Mongo数据库中，其具体过程为：

6-1)为每个体验者设立一个账号，生成一个“用户名.json”格式的数据文件，数据文件采用键值对进行记录；

6-2)创建用户实体UserData，在前端的GUI中获取数据，并通过UserData实例化对象传递数据，对.json文件进行读写操作；

6-3)使用C语言内置的I/O类库、File和FileStream及JsonUtility类库进行文件读写；读取数据时，将json字符串转成UserData对象；保存数据时，则将UserData对象转成json字符串。

Images