基于Web 3D智能人角色实时显示技术的研究与实现

何映彤

[摘           要]  随着世界步入互联网时代，人类的交流也进入了新的领域，而基于Web的 3D虚拟实现技术将是一种很好的表现方式。但是Web上难以加载、实时显示具有高仿效果的高精度模型，针对此情况设计一个3D智能人，在实现实时建模、实时显示角色表情动作与用户互动动作的基础上，解决在Web上实现实时显示具有真实感效果的3D场景，同时有效降低对网络和硬件的要求并提出新的展望。

[关    键   词]  Web 3D;实时显示技术;智能虚拟人

[中图分类号]  TP391.9             [文献标志码]  A              [文章编号]  2096-0603（2019）12-0110-02

一、绪论

随着网络科技的迅速发展、虚拟现实技术的产生，Web 3D虚拟现实技术也相继兴起，它是以计算机网络和计算机三维图形学为基础的网络三维技术。Web 3D技术具备形象视觉展示、人机交互和对现实世界进行模仿的功能，广泛应用于医疗保健、游戏行业、制造业和零售业等领域。而基于Web 3D的智能虚拟人设计，不仅可以在网络世界里通过第一或第三人称视角进行展示、交流，还可以让用户达到“沉浸—交互—构想”的更高层次境界。但由于硬件的计算和渲染性能的限制，基于Web 3D的模型大小和真实感是两个相互矛盾的方面。提高模型渲染真实感必定增加互联网平台的计算量，此时不对虚拟场景规模进行缩小处理，那么就会增加文件本身的容量，实现这种具有真实感的高质量的虚拟场景，对计算机的性能和网络宽带都有很高的要求;反之，扩展角色的规模，在确保其文件容量值一定的情况下，则只有降低场景外观的真实性，可见3D在Web上的实现还需突破瓶颈。

因此，本论文基于Web 3D智能人的角色，在互联网平台下对三维虚拟场景实现实时显示技术进行研究，同时在保证3D角色真实感效果下，有效降低对网络和硬件的要求进行研究。

二、 基于Web 3D智能人角色实时建模技术

本论文是通过3DS MAX软件作为开发平台进行建模，考虑到网络环境，在建模时要注意控制模型的精确度和导出文件的大小，以减小模型大小，利于网络传输，从而进一步实现基于Web 3D的实时显示技术，所以采用三角化算法对模型进行简化。将模型中的非三角面转化成三角拓扑结构，尽可能地缩小原始模型和简化后模型的差异，以简化模型面数来降低模型精度，从用户体验视觉上基本上看不到太大区别，达成模型优化效果，加快Web中3D模型的图像呈现和传输速度。

在建模完成后，将赋予角色贴图。由于要绘制具有较高写实度的角色，所以本模型采取纹理素材图片叠加AO贴图技术，即改善角色贴图阴影的方式代替图像更多的细节。首先对模型进行ID设置，如四肢设置为ID=1的材质球，头发设置为ID=2的材质球。模型在赋予材质后，将直接显示出ID的效果。所以在对模型ID设置完成后，需要对材质进行添加位图方式的编辑。先对模型增加UVW贴图和展开UVW命令，控制模型与贴图的严谨性;再结合Photoshop运用纹理素材并绘制贴图，将它作为基础纹理放置在贴图中;最后叠加AO图层，通过素材合成嘴巴、眼睛、眉毛、衣服等。

三、智能人角色表情动画实时显示技术

角色动画是对虚拟角色行为的描述。Web 3D智能人动画生成主要包含肢体动画和面部动画。为了保证Web 3D智能人在互联网平台上的实时显示，采取骨骼蒙皮动画技术制作肢体动画，即对模型添加“骨骼”和“封套”命令操作，并对模型进行动画驱动控制，设定动画关键帧、调整运动速度曲线，使其能实现行走、摇头、点头、招手等动画动作。在对模型添加骨骼和封套命令操作时，考虑到真正能表现虚拟人运动的骨骼数目并不多，所以通过减少定义模型的骨骼，降低封套的复杂性结构，进而以简化模型的文件大小来实现实时显示的肢体动画。

同时，采用变形器动画技术为模型添加面部动画，可以达成创建更逼真的角色表情仿真。添加一个表情时，需要对原模型进行复制操作，对复制出的模型进行顶点或边级别修改，关联到对原模型的修改。通过对复制的模型修改成不同的情感特征，拾取获得后需调节数值，其中数值0表示原模型不受复制模型的关联影响;数值100表示原模型完全受复制模型的关联影响，在界面中顯示出的是复制模型的表情。当设置多个表情，同时对其进行数值调整，原模型在界面显示的是几个表情的叠加情况。

四、角色场景实时显示实现技术

（一）基于Web的3D浏览关键技术

现今已有网上浏览3D几何模型的系统和直接3D可视化的浏览器，如3D STEP几何模型浏览系统、Google浏览器等。通过Google浏览器PC客户端的安装，启动系统的用户界面，三维模型就可以打开并展示在屏幕上，这种方法虽然可以实现3D模型在Web上的浏览，但是对如何可以实现基于Web的3D角色模型进行实时显示技术的浏览，现今的研究存在很多不足之处。本文通过上述几章实现了对3D模型进行实时建模的基础后，再阐述在Web上实现实时显示角色模型和最优化可视场景。

（二）基于Web 3D的场景优化

1.模型实时显示优化

基于众多浏览器对三维效果实时显示的限制要求，以及计算机三维图像在网络传输过程中的复杂运算，3D可视化模型不能直接展示在浏览器上，需要将建立好的3D智能虚拟人通过3DS MAX软件导出.WRL的格式，借用BS Contact VRML-X3D软件进行另存为.x3d的格式，在Web上即可观察到3D智能人模型。但是此时发现角色并没有正常实时显示出来，而是以模型混搭着框架骨骼的形式显示在用户界面。由于骨骼的面积比较大，所以模型身体上多出面积被遮挡，严重影响了基于Web的3D实时显示特性。

结合本次研究的实验发现，通过在命令面板里选择隐藏骨骼后，测试效果发现模型的显示效果仍与之前的一样，骨骼并没有被隐藏掉。出现这个问题的原因是为角色模型建立的骨骼当中包含的信息还有IK链对象信息、关节点信息。按类别隐藏，IK链对象信息与关节点信息并没有包括在内，从而导致骨骼整个类别隐藏的失效。经对此研究与分析，发掘出解决这个问题可以选择模型后进入对象属性修改级别，按照建模时给骨骼的命名选择需要隐藏的骨骼与其相关联的信息要素，在确保这些骨骼类别信息完全选中后再按确定按钮。在3DS MAX中选择渲染进行观察，可以发现，此时骨骼已被隐藏，具有真实感的3D智能虚拟人显示在用户界面。

2.灯光布置

自然界中的物体能够被看到，是因为光线映射于物体表面后反射到观察者的眼中，物体外观的材质性质和光源的属性决定物体的颜色。该原理同样适合于虚拟模型中，模型在没有进行任何灯光设置操作的情况下，通过在Web上浏览发现，3D智能人皮肤比较暗淡，面部表情难以辨认，手臂处光泽度偏暗，没有达到真实的视觉外观。由于智能虚拟人本身不会发光，更不会有光线反射，所以此时模型没有实时显示出真实感效果。根据上述原理，对模型进行光照计算，添加目标聚光灯，它可以产生锥形照射区，在照射区域外不受灯光的影响。为有效降低模型对网络和硬件的要求，打开 “/强度/颜色/衰减”属性栏，将“倍增”值设置为0.5。

3.摄像机设置

在Web上会发现，定位的三维场景中并没有从人眼所观察到的角度将模型投影到正确的界面位置，显示出的角色模型状态呈现仰视效果。通过对摄像机的设置，可以解决这一问题，建立模型最优视图。3DS MAX软件中摄像机的视觉范围跟现实的摄像机镜头原理一致，展示出的结果与真实世界一样具备立体感。所以在摆放摄像机的位置时，要配合用户的视觉习惯，使摄像机横向配置于立体智能人模型。并对摄像机参数属性进行调节，分别设置类型为目标摄像机、镜头焦距为81.0 mm、视野为25.058度、近距范围是17、远距范围为550、目标距离479.544。在摄像机视图中观察模型，保存后进行导出测试，可以观察到智能人在Web上显示出正确的界面位置。

4.渲染优化

3D智能人在实时建模完成以后，为了更好地观察其外观造型、肢体结构和颜色纹理情况，需要对角色模型进行渲染优化处理，这里的实时渲染采用视锥剔除算法与背面剔除算法。虚拟智能人在无人机互动操作时，是以正面的方式呈现在浏览器上，这时可启用背面剔除算法，对模型的所有背面多边形进行剔除，确保只渲染面向摄像机的多边形。其中背面剔除算法中判断背向多边形，是通过模型中多边形的法向量x以及在某一特定视点的多边形向量y的内积，如果得出的内积数值小于零，则为背向多边形;而视锥剔除算法，基本原理是将视锥剔除置于渲染管线程序阶段，几何变换阶段和光栅化阶段都能减少计算量，从而加速实现基于Web的3D模型实时显示技术。采用上述两种算法的结合，有效降低对网络和硬件的要求，进一步实现了基于Web的3D场景的实时显示技术。

五、总结与展望

随着对三维仿真模型技术要求的提高、Web 3D技术的深入，Web 3D在未来的领域需求应用将会更加广泛。本论文用一个3D智能人为例，在现今硬件和网络技术暂时没有进一步提升的情况下，通过实时建模技术降低模型的大小，实现模型的真实性仿真效果的形象展示，并使之具备动态交互顯示（动作和表情的动态实现），有效地降低对网络和硬件的要求。基于WEB的3D浏览技术的使用方式免除了客户端升级的繁琐，但随着移动互联网时代的到来，还存在众多系统平台、浏览器需要基于插件技术解决的问题，也存在对CPU硬件的高要求问题。所以，在今后的研究工作中需要更多关注对程序进行并行化处理。

参考文献：

[1]夏良正.基于VRML的Web3D环境交互方法[J].计算机系统应用，2010，19（10）：250-252.

[2]艾达，乔明明，李敏.Web 3D技术综述[J]. 信息技术与网络安全，2014（2）：4-7.

[3]常村红.三维虚拟人技术研究[J].数字技术与应用，2012（3）：74.

[4]蔡金梅.场景设计与三维动画之间的关系[J].计算机及论坛，2012（9）：54.

[5]刘治国，王育.浅谈向Google Earth发布3D模型的方法[J].信息技术，2009（6）：25-27.

编辑 冯永霞