基于Web的三维虚拟展馆的设计与实现

李海涛 （大庆市科学技术局，黑龙江 大庆163302）

李 冀，贾常见，魏艳吉 （东北石油大学软件学院，黑龙江 大庆163318）

展馆，是一种载体，主办方将自己心中所想以及所拥有的产品或技术以及成果等展示在其中［1］。随着互联网技术及众多应用手段的不断成熟和发展，实体展馆已不能满足人们的需求，如传统实体展馆拘泥于场地的限制，参观者在百忙之中需抽出时间到实体展馆处才能参观，所以三维虚拟展馆应运而生。

三维虚拟展馆就是利用计算机图形学的技术构建的数字化展览馆，是一种三维互动体验方式［2］。三维虚拟展馆以传统展馆为基础，利用三维虚拟技术将展馆及其陈列品移植到互联网上进行展示、宣传，突破了传统意义上的时间与空间的局限。为此，笔者设计与实现了一种基于Web的三维虚拟展馆展示平台。

1 三维虚拟展馆系统的特点

1）环境可控性 三维虚拟展馆在网页中显示可通过窗口互动控制环境，虚拟展馆在互动平台上缩放自如，浏览者可以用第一视角方式360°自由浏览，并根据个人喜好进行环境控制及音乐控制，系统用数字化而非实体的方式实现展示、典藏、研究等功能。

2）互动性 三维虚拟展馆的互动性主要体现在获取信息和显示展馆2个方面。用数字化的形式实现展馆的存储，用户可以通过导航准确定位到相应地区、与电脑交互获取互动游戏、并获取扩展资讯等等。

3）扩充性 笔者创建的三维模型库里面存储了大量的展品模型，展馆的信息被完全真实的反映出来。三维虚拟展馆将所有信息展现在网络中，是信息及时更新的系统，系统的可扩充性大大提高。展馆也可根据需要随时增添删除展台展品信息，可扩充性非常强。

4）信息的丰富性 相较于实体展馆相，三维虚拟展馆可反映更多的的信息量，除了展示各种展台展品外，还能与数据库配合，实现海量信息的管理和使用。另外，三维虚拟展馆中还可以表达文字、图形 （像）、声音、flash动画等多种信息，展馆的各类信息在系统中用各种不同形式被整合起来，使信息的负载量和获取量极大提高。

5）便利性 与传统的实体展馆的建设初期相同，三维虚拟展馆在制作的过程也需要规划展馆面积、形状、采集信息、绘制平面图等，但却不需要用一砖一瓦建设展馆的工作，因此成本相对较低、制作周期短。利用网络，用户在任何地方随时可以进入浏览，不用到目的地购票入场浏览。

6）节约资源、低碳环保 相对于实体展馆展示时所需的高昂的场馆租借费、布展费以及远距离的展品运输费和风险和展馆参观者遗留的垃圾对环境造成的负担等等，三维虚拟展馆可大大节省展馆构建的费用，节省了大量资源，真正的实现了环保节能、低碳生活。

2 系统开发流程

首先收集前期需要的数据资料，计划展馆的面积和展台的分布；统计要创建的展台、展品等模型的数量；决定要实现的功能。之后进行三维模型的构建，以及后期的音效设计、字幕说明、展示动作设计、交互动作设计，到最终的平台发布。用VR－Platform三维互动平台实现系统交互功能的开发。该平台能与3DSMAX软件进行无缝结合，支持3DSMAX的粒子系统、渲染效果、关键帧动画和变形动画等多种功能［3］。系统流程图如图1所示。

3 三维场景的制作及模型的渲染

1）图像采集 在建模之前，需要用高清数码设备对展馆、展台及展品等实物的图像资料进行采集，主要包括三类：一是展馆大体结构、展台的外观，理清展馆的布局；二是展台上展品、装饰品等的图片，以便根据图片构建精细模型；三是实体纹理图（包括展品、地面等等），主要采用特写方式拍摄，尽量使视角端正清晰，用于模型的纹理贴图。

2）几何建模 目前，用于三维建模的软件有很多种，笔者选用了操作相对灵活简便的3DSMAX软件进行模型的创建。利用3dsMAX完成需要展示的产品的三维模型的构建，在三维虚拟展馆中共完成了696个模型的构建，约16万面。使用PhotoShop软件处理采集回的图像，制成纹理贴图。在模型构建完成后，为每个模型赋上贴图纹理，力求与真实物体相符，因为模型的纹理和材质不合适将会直接影响系统的效果。如果对物体的一些细节都通过细致建模的方法来实现，就会大大增加模型的面数，不见得有很好的真实感，也会减慢了加载速度，所以引入贴图也可以有效地减少数据量。完成后的模型如图2所示。

图1 三维虚拟展馆的构建流程

图2 完成后的模型效果图

3）场景优化 三维模型的构造只是创建虚拟场景的第一步，考虑到虚拟现实系统要求实时展示和网络带宽的限制，虚拟展示系统的建模应当遵循一个原则：在能够保证视觉效果的前提下，尽量采用比较简单的模型［4］。因此模型优化在场景创建时是重要的，建模时主要采用删除隐藏面、减少分段数、使用纹理贴图、使用Optimize修改器等方法。

4）贴图烘焙 制作好了各个实体的三维模型后，需要给模型加上灯光、阴影以及反光等的效果，当将模型导入到VR－Platform中时，光影效果不能被一同导入，所以需要将各种效果渲染到纹理以便永久保持，即烘焙，这样看上去就有了真实的光影效果。选择3dsMAX自带的Mental ray渲染器，这种渲染器可以实现大型场景的烘焙，也可以快速渲染逼真的环境［5］。

4 展馆功能的实现

在展馆中所有展台、展品以及各类装饰物的三维模型都创建完成并将光影效果渲染到模型纹理上后，将所有模型统一导入到虚拟现实平台VR－Platform中，加入碰撞检测算法，贴近于物理碰撞，使人物不会从模型中穿过。接下来就是实现三维展馆的一些基本功能。

1）选择角色登陆展馆 用户进入展馆时可以选择自己喜欢的角色登陆，用不同的视角参观展馆，增加漫游的趣味性。

要实现上述功能需要在虚拟现实平台VR－Platform的高级界面中添加一个控件静态图片，为其附上一张处理好的图片为背景，并设置其属性，作为窗口底图。然后在男士和女士图形上分别添加一个图片按钮，并设置其贴图使之成透明样式，当用户登录时，将其选择的角色名保存在一个变量中，并在脚本编辑器中添加图片按钮的脚本，判断变量的值。如果变量的值为“1”，设置控件静态文本的文本内容为：“您选择了男士角色登录”，然后切换到男士相机视角漫游展馆；反之，设置控件静态文本的文本内容为：“您选择了女士角色登录”，然后切换到女士相机视角漫游展馆。再添加一个图片按钮控件，设置文本内容为“登录”，在脚本编辑器中设置按钮的脚本，隐藏登录界面及登陆界面上的各个控件，播放事先录制好的时间轴动画表示将图片隐藏的效果，显示展馆，打开用户选择的角色相机。

2）展馆漫游 展馆漫游是三维虚拟展馆最基本的功能，也是虚拟展馆的重要特征。下面简要介绍其实现的方法。将制作好的三维模型统一导入到虚拟现实平台VR－Platform中，细微调整模型的位置、大小，让它们看上去更加一致和谐美观。添加一些骨骼动画，包括了登录后引领用户漫游的男士和女士。若用户选择女士角色登录，则设置女士骨骼动画模型的显示隐藏属性为显示，用户就可以开始漫游了。用户可以用第一视角方式360°自由浏览。展馆漫游截图如图3所示。

3）展区快速定位 在菜单的子菜单 【展区】下再添加一层子菜单，表示各个展区的名称，点击展区的按钮，可以快速切换至相应展台的位置。下面简单介绍其实现方法。

在 【展区】按钮下添加9个图片按钮，分别赋上用Photoshop处理好的图片，如新型材料、精细化工等。然后在展区的提示牌上架设定点相机，相机的名字对应展区的名字。在脚本编辑器中编辑各个图片按钮的脚本语句，点击按钮，通过名称切换相机，如“切换相机 （通过名称），电子信息展区，0”。句中“电子信息展区”为要切换到的展区名称，0为重置相机。此时，便可快速定位到用户想参观的展区处。

4）用户留言 在高级界面中添加一个窗口，在窗口上添加控件，静态图片、静态文本、输入框与图片按钮。显示留言界面时，用户可以输入对展馆的看法，点击 【提交】按钮，将留言内容存入数据库；点击 【取消】按钮，取消留言，关闭留言对话框。留言及查看留言界面如图4所示。

图3 展馆漫游截图

图4 留言及查看留言界面

5）音量控制 在高级界面中添加2个图片按钮控件 （一个用来开启音乐，另一个用来关闭音乐），一个滑竿控件。点击图片按钮开启或关闭音乐创建打开或关闭音乐的函数。在脚本编辑器中编辑控制音量的函数，获取到滑动条的值，将其赋给变量a，设置音量大小为a。拖动滑竿就可以自定义设置音量的大小。

5 发布系统

在VR－Platform中 【文件】下选择发布为VRPIE文件，VRP－IE使用ActiveX技术，将VR－Platform作为控件嵌入到IE浏览器中，并能够根据HTML所传递进来的消息去解释和执行VRP的脚本函数和命令。这样就可将制作好的三维虚拟展馆发布到网络上，以供浏览参观。

6 结 语

基于Web的三维虚拟展馆系统具有广泛的应用领域，随着虚拟展馆开发技术的成熟，其商业价值也将会得到进一步的利用和开发。届时，各类博物馆的展品也将在网络中呈现，各种大型的商品展览会将在网络上召开。人们足不出户参观展馆、挑选商品的愿望将会实现。

［1］游珊珊.博览建筑内外环境设计研究 ［D］.武汉：华中科技大学，2011.

［2］孙元浩，龚震宇，俞建新，等 .虚拟展览馆的构建方法 ［J］.系统仿真学报，2003，15（3）：322－325.

［3］韩乐，吴秀芹，赵旦春，等 .基于VRP的数字校园设计与实现 ［J］.长江大学学报 （自然科学版），2011，8（11）：86－88.

［4］孙染 .基于Internet的虚拟展示系统的设计与实现 ［D］.北京：北京邮电大学，2011.

［5］纪菲 .网络景观电子地图的设计与研发 ［D］.青岛：中国海洋大学，2009.