王佩雯，张紫桂，杨成，梁弼
摘 要 针对Web平台展示古建筑文物单调性等问题，采用PTGui与Pano2VR工具来设计和制作交互式古建筑文物三维全景漫游，并使用HTML5技术将其嵌入到Web页面中，这使得Web平台具有三维动态展示古建筑文物的能力。实际调研证明，将全景漫游恰当应用到Web平台能让浏览者感受到不一样的视觉效果，能有效提高用户体验，并能增加Web平台的访问量。
关键词 PTGui；Pano2VR；全景漫游；古建筑文物；设计和制作
中图分类号 G2 文献标识码 A 文章编号 2096-0360（2018）04-0042-03
古建筑文物是指具有历史意义的建国之前的民用建筑和公共建筑，目前很多古镇以及大城市还保留着一些古建筑文物。古建筑本身是一种综合性艺术，它融合了材料、建筑技术、美术、雕塑等为一体的造型艺术，使人们在有限的空间里有美的享受。并且，古建筑文化随着社会的发展越来越受到人们关注和重视，越来越多的学者和爱好者从事这方面研究[1]。
目前，通过Web平台来展示古建筑文物主要以图片、文字及视频等，但缺少交互性功能，给浏览者带来的体检有些单调。古建筑文物本身是三维立体的，为了让浏览者在Web上有不一样的视觉感受，本文通过目前主流的全景开发工具来设计和制作交互式古建筑文物三维全景漫游，并将其嵌入到Web平台中，让浏览者通过Web平台就可以全方位欣赏到古建筑文物，并有“身临其境，触手可及”的感受，进而吸引浏览者亲自前往观赏。
1 相关技术
1.1 全景图拼接技术
Panorama Tools是目前功能最为强大的全景图制作工具，但它需要用户编写脚本命令才能工作。而PTGui通过为全景图制作工具（Panorama Tools）提供可视化界面来实现对图像的拼接，从而创造出高质量的全景图[2]。因此，本文采用PTGui来设计古建筑文物的全景图。
1.2 全景漫游场景技术
Pano2VR是一个全景漫游图合成软件。它把全景图转换成QuickTime或者Macromedia Flash格式的全景漫游，可以定制皮肤，选择用户界面语言。同时，它支持平、圆柱、球、立方体面片、交叉、T、条状和Quick Time VR作为输入格式与增加能力，这些格式之间转换的修饰的立方体的脸[3]。并且多个漫游图之间可以设置热点，实现漫游图的切换。
1.3 HTML5技术
HTML5是目前流行的一种超文本标记语言，它解决了HTML4等之前规范中的很多问题。并且，HTML5中增加了许多新特性，例如嵌入音频、视频和图片的函数、客户端存储数据、交互式文档等，通过制定如何处理所有HTML元素以及如何从错误中恢复的精确规则[4]。而且，HTML5进一步增强了互动性，并有效减少了开发成本。
2 交互式全景漫游的设计与制作
2.1 采集图片
原始图片的获取是制作交互式古建筑文物全景漫游的第一步。需要用到数码单反相机、普通云台和三脚架。在拍摄照片时，首先将三脚架调整至水平，再将相机竖直固定在三脚架的云台上，确保拍摄时云台能正常旋转。为了避免按动快门时的轻微震动导致拍摄出的照片模糊，可以把拍摄模式设定为定时拍摄。根据相机镜头和所要拍摄场景的不同可以选择合适的拍摄张数，并且要求相邻照片要有一定的重合区域，该区域不宜过大也不宜过小，建议在30%左右。在拍摄过程中，不能改变相机的参数，以使同一组照片色调和明暗保持一致。由于地面三脚架底部区域相机无法覆盖，因此如果地面纹理较为复杂，则应对地面进行补拍，以备后期处理时使用。图1展示了本文通过拍摄采集到的部分古建筑文物图片效果。
2.2 生成全景图
生成全景图的主要任务是将所采集的原始图片拼接为一张水平360度视角、垂直180度视角、长宽比为2︰1的全景图片。该过程我们使用PTGui软件来完成，其基本实现过程可以分为五步：图片载入，特征点定位，图片配准和融合，生成全景图以及全景图修补[5]。
在全景图修补时，由于全景图是将球面映射到平面上，本身就具有一定的变形，尤其是天空和地面的变形较大，因此不能直接在Photoshop软件中对地面和天空进行修补。这里提供两种方法进行修补：一是利用PTGui软件，将一张2︰1的球面映射全景图转化为六张1︰1的立方体映射，这六张图刚好是立方体的六个面，由于这六张图不存在形变问题，可将其载入Photoshop进行修补；二是先将全景图导入Photoshop，利用Photoshop的极坐标功能，产生平面坐标到极坐标，将地面和天空平面化，再进行修补。图2展示了通过PTGui生成并修补后的全景图。
2.3 合成三維全景漫游
生成古建筑文物的全景图并修补后，接下来使用Pano2VR来合成三维全景漫游。全景漫游的合成主要涉及到交互热区和热点的设置，具体设置及效果如图3所示。
如果设置有多个场景之间的热点，则还需要设置在视觉效果选项卡中的过场效果选项里的一些参数，以此来达到场景切换时的自然过渡。对于播放器的控制按钮，选择一款软件默认的按钮皮肤。最后选择文件输出格式（如.swf等）和输出文件名与路径，全部设置好后点击确认。具体设置内容如图4所示。
这样我们就完成了交互式古建筑文物全景漫游图的合成，其具体效果如图5所示。
3 Web页面展示
为了增强古建筑文物在Web平台上的用户体验，在页面中放入三维全景漫游是非常必要的。全景技术以全新的视角为开发者打开了Web端的新大门，全景实景漫游效果更是让浏览者有身临其境之感，它突破了时间、空间的现实，带着浏览者走进真实的场景，也带给浏览者极致的Web体验。在Web页中放入古建筑文物全景漫游图的具体过程如下。
首先，把已生成好的古建筑文物全景漫游输出文件（如pano.swf）放到Web项目的3D文件目录中，具体如图6所示。
接着，在index.jsp页面中通过
最后，运行Web项目，并访问页面，即可浏览到交互式的古建筑文物全景漫游，其效果展示如图8所示。
4 结束语
本文采用PTGui和Pano2VR全景漫游圖技术及其他辅助工具设计并实现了古建筑文物交互式全景漫游效果，并使用HTML5技术将其放入Web页面中，这是目前呈现古建筑文物一种非常好的方式。而且，本古建筑文物全景漫游是通过实地取景来生成的，其取材的真实性使其全景漫游效果具有更强的真实感，让浏览者有身临其境的全景沉浸感。同时，该实景漫游能在Web上呈现，浏览者可以在网络环境下随意浏览，其上下、左右拖动等功能都让浏览者有很强的全景交互感。总的来讲，通过全景漫游图技术可以快速的设计和制作交互式古建筑文物全景漫游效果，当嵌入Web平台能有效提高浏览者的体验和平台的访问量。
参考文献
[1]张洪吉，罗勇，裴尼松，等.基于三维激光扫描的古建筑文物三维数字化保护研究——以四川乐山文庙大成殿为例[J].测绘与空间地理信息，2016，39（7）：42-44.
[2]高轶.全景照片合成技术及PTGUI的运用[J].电脑知识与技术，2010，25（6）：7114-7117.
[3]孙君菊，甘露.基于Pano2VR的三维全景校园漫游系统设计与实现[J].福建电脑，2016，32（6）：129-130.
[4]程荣贇.基于HTML5技术的响应式Web设计浅析[J].电子世界，2017，22（39）：79-80.
[5]叶萍萍，罗宏.基于PTGui Pro、Pano2VR的三维全景图制作方法与应用[J].城市勘测，2012（4）：66-69.
[6]何定华，王阳明.iframe在网页设计中的巧用[J].城市建设理论研究（电子版），2013（32）：1-2.
[7]Bi Liang.The Study and Application of the New Control Layer for Enterprise-Class Web Applications.Journal of Computers（Taiwan），Vol.28，No.6，2017，pp.151-162. [doi：10.3966/199115992017122806013].
rame>
