使用PixMaker软件制作网页上的360度旋转全景图(1)

   第一节 虚拟全景技术概述

 

虚拟全景技术是在网上能够进行360度全景观察，而且通过交互操作，可以实现自由浏览，从而体验三维的VR视觉世界。全景图像，是指大于双眼正常有效视角（大约水平90度，垂直70度）或双眼余光视角（大约水平180度，垂直90度），乃至360度完整场景范围的照片。

 

全景摄影是指把相机环360 度拍摄的一组照片通过无缝处理，所拼接成的一张全景图像。现在随着人们的实际需要，全景摄影的内涵也发生了变化，把相机环某一个大角度（不一定为360度）拍摄的一组照片或环360度拍摄的一组照片，经过处理所拼接成的一张图像，都称作全景图像。

 

然后运用一定的网络技术将全景图像在互联网上显示，并具有较强的互动性，使您能用鼠标控制环视的方向，可左可右，可上可下，可近可远，可大可小，使您有身临其境的感觉，称之为虚拟全景。

 

1．虚拟全景技术的分类
几年来，虚拟全景技术已经从简单的柱形全景，发展到球形全景，对象全景等。
柱形全景: 柱形全景是最为简单的全景虚拟。所谓柱形全景，您可以环水平360度（或某一个大角度）观看四周的景色，但是如果用鼠标上下拖动时，上下的视野将受到限制，您看不到天顶，也看不到地底。这是因为用普通相机拍摄照片的纵向视角小于180度。显然这种照片的真实感不理想。
球形全景：球形全景视角是水平360度，垂直180度，全视角。可以说您已经融入了虚拟环境之中了。球形全景照片的制作比较专业，首先必须用专业鱼眼镜头拍摄两张照片，然后再用专用的软件把它们拼接起来，做成球面展开的全景图像，最后把全景照片嵌入您的网页中。在美国，也不是所有的制作软件都支持球形全景。有的专业公司提供球形全景制作的全套软硬件设备，但价格昂贵。
立方体全景：是另外一种实现全景视角的拼合技术，它打破了原有单一球型全景的拼合技术，使您能拼合出更高精度和更高储存效率的全景。立方体全景照片的制作也比较复杂，首先拍摄照片时，要把上下前后左右全部拍下来，但是可以使用普通数码相机拍摄，只不过普通相机要拍摄很多张照片（最后拼合成六张照片），然后再用专用的软件（如3Dvista商业版）把它们拼接起来，做成立方体展开的全景图像，最后把全景照片嵌入您的网页中。
对象全景: 对象全景是瞄准互联网上的电子商务的。它与风景全景的主要区别是：拍摄时瞄准对象（如你要拍摄汽车，汽车就是对象），转动对象，每转动一个角度，拍摄一张，顺序完成。然后选用对象全景的播放软件，并把它们嵌入你的网页中，发布到您的网站上。
球形视频：这是一种全动态，全视角，带音响的全景虚拟，美国已有公司推出其顶尖产品（如pixmaker pro商业版、3Dvista商业版支持视频合成），效果很不错，只可惜，目前的网络带宽不足，几十M的下载使人无法忍耐。

 

2．虚拟全景显示插件的比较
Java Applet：其优点是无须下载插件，文件尺寸小而且下载快，是最常用的全景显示插件。但是它也有缺点，就是幅面较小，图像质量稍差，动态显示时有跳动感，不很连续，不支持Windows XP。
QTVR：其优点是图像质量最好，与其他Web3D或视频播放共用插件，支持cubic全景。其缺点是需要下载插件Quicktime，适于在本地主机上演示，有专用文件格式(.MOV)，制作工具软件专用，需quicktime VR authoring studio ，但使用极为普遍。
Shockwave3d：其优点是图像质量好，文件尺寸小，能与其他Web3D共用插件。缺点是需要下载插件Shockwave Player、Shockwave Director player和 Flash player。虽需下载插件， 但使用极普遍。
Imove：其优点是图像质量好,可做大幅面全景。缺点是需要下载插件，文件尺寸稍大。其全景是专用文件格式，3DMAX或3DVIZ可输出此文件格式(.PAN)。

 

3．虚拟全景技术的应用
（1）教育领域的应用
虚拟全景技术以较低的制作成本获得一定程度的虚拟现实体验，它在立体空间的展示，立体物体的展示，展品的介绍，虚拟场景的构造等方面有着作独特的优势。教育过程中的很重要的一个过程就是呈献知识信息，而虚拟全景技术在呈献知识信息方面有着独特的优势，它可以在广泛的科目领域提供无限的VR体验，从而加速和巩固学生学习知识的过程，因而它在教育领域的有着十分广泛的应用前景，特别是在建筑工程学、考古学、医学教育、导游培训、历史教育、化学和物理教育、社会科学等方面具有很大的发展空间。
（2）商业领域的应用
全景摄影是一种比较实用的技术，在网络带宽仍然紧俏的今天，是在互联网上展示准3D图形的好工具。然而它毕竟不是真3D图形技术，它的交互性远远不如基于造型技术的虚拟现实。但是它现在也有广阔的发展前景，可应用于网站建设、多媒体光盘制作、电子商务、房地产展示、虚拟旅游、地理信息系统、宾馆酒店、虚拟展览等领域。
场景场地展示： 身临其境的感受，应用于建筑装饰、宾馆、餐馆、 KTV、个性酒吧、娱乐城、高尔夫球场、艺术馆、美术馆、博物馆、展览馆等等。
旅游风光展示：通常人们对通过宣传手册获得景点的认识也仅仅是表面的。每一个潜在旅游消费者都希望在出游之前身临其境般的体验景点游览的过程。通过计算机虚拟技术可以实现以上设想。还能以触摸屏、光盘、现场演示的多种表现形式来体现。
楼 盘 展示：真实的展现楼盘的居住环境、室内格局，是商家向用户展示楼盘的最佳方法。
GIS地理信息系统：面对着大家的不再是一张平面的地图，而是实际的可感知的城市：360°全景漫游，让整个城市最有代表的风貌凹现，配合功能强大的GIS地理信息系统，数字城市的宽带漫游带你畅游世界。
产品物品展示：栩栩如生的物体，诸如汽车、摩托车、时装、古董、珠宝、钟表、艺术品、服装、玩具、仪器设备、家用电器等。
招 商 引资：以虚拟漫游及三维漫游的方式表现招商环境，对于潜在资源可以融和其它形式综合体现，同时适于互联网的浏览方式让旅游招商引资的面向用户更加广大。

   第一节 虚拟全景技术概述

 

虚拟全景技术是在网上能够进行360度全景观察，而且通过交互操作，可以实现自由浏览，从而体验三维的VR视觉世界。全景图像，是指大于双眼正常有效视角（大约水平90度，垂直70度）或双眼余光视角（大约水平180度，垂直90度），乃至360度完整场景范围的照片。

 

全景摄影是指把相机环360 度拍摄的一组照片通过无缝处理，所拼接成的一张全景图像。现在随着人们的实际需要，全景摄影的内涵也发生了变化，把相机环某一个大角度（不一定为360度）拍摄的一组照片或环360度拍摄的一组照片，经过处理所拼接成的一张图像，都称作全景图像。

 

然后运用一定的网络技术将全景图像在互联网上显示，并具有较强的互动性，使您能用鼠标控制环视的方向，可左可右，可上可下，可近可远，可大可小，使您有身临其境的感觉，称之为虚拟全景。

 

1．虚拟全景技术的分类
几年来，虚拟全景技术已经从简单的柱形全景，发展到球形全景，对象全景等。
柱形全景: 柱形全景是最为简单的全景虚拟。所谓柱形全景，您可以环水平360度（或某一个大角度）观看四周的景色，但是如果用鼠标上下拖动时，上下的视野将受到限制，您看不到天顶，也看不到地底。这是因为用普通相机拍摄照片的纵向视角小于180度。显然这种照片的真实感不理想。
球形全景：球形全景视角是水平360度，垂直180度，全视角。可以说您已经融入了虚拟环境之中了。球形全景照片的制作比较专业，首先必须用专业鱼眼镜头拍摄两张照片，然后再用专用的软件把它们拼接起来，做成球面展开的全景图像，最后把全景照片嵌入您的网页中。在美国，也不是所有的制作软件都支持球形全景。有的专业公司提供球形全景制作的全套软硬件设备，但价格昂贵。
立方体全景：是另外一种实现全景视角的拼合技术，它打破了原有单一球型全景的拼合技术，使您能拼合出更高精度和更高储存效率的全景。立方体全景照片的制作也比较复杂，首先拍摄照片时，要把上下前后左右全部拍下来，但是可以使用普通数码相机拍摄，只不过普通相机要拍摄很多张照片（最后拼合成六张照片），然后再用专用的软件（如3Dvista商业版）把它们拼接起来，做成立方体展开的全景图像，最后把全景照片嵌入您的网页中。
对象全景: 对象全景是瞄准互联网上的电子商务的。它与风景全景的主要区别是：拍摄时瞄准对象（如你要拍摄汽车，汽车就是对象），转动对象，每转动一个角度，拍摄一张，顺序完成。然后选用对象全景的播放软件，并把它们嵌入你的网页中，发布到您的网站上。
球形视频：这是一种全动态，全视角，带音响的全景虚拟，美国已有公司推出其顶尖产品（如pixmaker pro商业版、3Dvista商业版支持视频合成），效果很不错，只可惜，目前的网络带宽不足，几十M的下载使人无法忍耐。

 

2．虚拟全景显示插件的比较
Java Applet：其优点是无须下载插件，文件尺寸小而且下载快，是最常用的全景显示插件。但是它也有缺点，就是幅面较小，图像质量稍差，动态显示时有跳动感，不很连续，不支持Windows XP。
QTVR：其优点是图像质量最好，与其他Web3D或视频播放共用插件，支持cubic全景。其缺点是需要下载插件Quicktime，适于在本地主机上演示，有专用文件格式(.MOV)，制作工具软件专用，需quicktime VR authoring studio ，但使用极为普遍。
Shockwave3d：其优点是图像质量好，文件尺寸小，能与其他Web3D共用插件。缺点是需要下载插件Shockwave Player、Shockwave Director player和 Flash player。虽需下载插件， 但使用极普遍。
Imove：其优点是图像质量好,可做大幅面全景。缺点是需要下载插件，文件尺寸稍大。其全景是专用文件格式，3DMAX或3DVIZ可输出此文件格式(.PAN)。

 

3．虚拟全景技术的应用
（1）教育领域的应用
虚拟全景技术以较低的制作成本获得一定程度的虚拟现实体验，它在立体空间的展示，立体物体的展示，展品的介绍，虚拟场景的构造等方面有着作独特的优势。教育过程中的很重要的一个过程就是呈献知识信息，而虚拟全景技术在呈献知识信息方面有着独特的优势，它可以在广泛的科目领域提供无限的VR体验，从而加速和巩固学生学习知识的过程，因而它在教育领域的有着十分广泛的应用前景，特别是在建筑工程学、考古学、医学教育、导游培训、历史教育、化学和物理教育、社会科学等方面具有很大的发展空间。
（2）商业领域的应用
全景摄影是一种比较实用的技术，在网络带宽仍然紧俏的今天，是在互联网上展示准3D图形的好工具。然而它毕竟不是真3D图形技术，它的交互性远远不如基于造型技术的虚拟现实。但是它现在也有广阔的发展前景，可应用于网站建设、多媒体光盘制作、电子商务、房地产展示、虚拟旅游、地理信息系统、宾馆酒店、虚拟展览等领域。
场景场地展示： 身临其境的感受，应用于建筑装饰、宾馆、餐馆、 KTV、个性酒吧、娱乐城、高尔夫球场、艺术馆、美术馆、博物馆、展览馆等等。
旅游风光展示：通常人们对通过宣传手册获得景点的认识也仅仅是表面的。每一个潜在旅游消费者都希望在出游之前身临其境般的体验景点游览的过程。通过计算机虚拟技术可以实现以上设想。还能以触摸屏、光盘、现场演示的多种表现形式来体现。
楼 盘 展示：真实的展现楼盘的居住环境、室内格局，是商家向用户展示楼盘的最佳方法。
GIS地理信息系统：面对着大家的不再是一张平面的地图，而是实际的可感知的城市：360°全景漫游，让整个城市最有代表的风貌凹现，配合功能强大的GIS地理信息系统，数字城市的宽带漫游带你畅游世界。
产品物品展示：栩栩如生的物体，诸如汽车、摩托车、时装、古董、珠宝、钟表、艺术品、服装、玩具、仪器设备、家用电器等。
招 商 引资：以虚拟漫游及三维漫游的方式表现招商环境，对于潜在资源可以融和其它形式综合体现，同时适于互联网的浏览方式让旅游招商引资的面向用户更加广大。

第三节 PixMaker使用

 

PixMaker是一个简单方便的360度全景图片制作软件，它可以将描写一个环型场景的多个连续图片无缝地接合在一起，形成一个360度“场景”图片。可以在网页上播放，使你的页面更加生动活泼。

PixMaker软件在网页上显示全景图片是靠程序本身提供的一个“Java applet”小程序组件，只要网页编辑者将这个组件放到与全景图页面相同的目录下，就可以用常用的浏览器在网页上播放全景图片。这与目前流行的“Ulead Cool 360全景制作软件”不同，“Ulead Cool 360”制作的网页全景图片，需要浏览者首先下载一个“全景图观察器”插件到的浏览器上才可以播放全景图片，相比之下，PixMaker使用起来感觉更方便自然。PixMaker可以很好地自动处理图片边界的连接，看不出任何接缝的痕迹。在你准备好一组连续场景图片的前题下，PixMaker只需几个简单的操作步骤，就可自动完成全景图片从制作到发行的全过程。

１．制作一组全景图片的步骤和注意的问题。
（１）使照像机平行于地面并最好固定在三角架上。
（２）拍摄每一幅照片时要保持照像机在同一个高度。
（３）以一个固定点为圆心，顺时针方向旋转拍摄每一幅照片。
（４）每一幅照片的边界要有30％左右的重叠区域。
（５）要注意将移动的物体拍摄在照片的中间，不要让移动物体出现的照片相交错的边界上，以免对以后照片的边界处理带来不便。
（６）根据你使用的照像设备的不同，使用扫描仪等设备将照片处理成JPG格式的图片文件，图片的尺寸可根据你自己的需要决定，文件名最好按字母顺序排列。

２．将多张连续的场景图片输入到PXIMAKER处理窗口。
（１）启动PixMaker程序，可以看到程序窗口上方有三个大图标，分别标记有“1—Snap”（抓取图片）、“2－Stitch”（缝合图片）、“3－Publish”（发行一个“场景”），下面是“Stitch”（缝合图片）标签板窗口。（见图1） 
 

（２）用鼠标点击“1—Snap”(抓取图片)图标，在出现的一个指定图片获取位置的对话框中选择“My computer”并按“OK”按钮，在打开的文件输入对话框中找到保存文件的目录。本文为方便起见，就以PIXMAKER程序的SAMPLE目录下自带的图片文件为例，它是一组展览大厅的场景图片，文件名为“Sample01—Sample12”。按下“SHIFT”键不放，用鼠标选择这一组文件，或按下ALT键不放，用鼠标选择所需的图片文件，然后按“OPEN”（打开）按钮，所选择的图片文件就排列在“Stitch”标签板上方的窗口内（见图1上面的窗口），并出现一个工具条，上边有插入、删除、移动图片、图片类型(Type)、镜头选择(Lens)等操作命令图标。其中图片类型选360度，镜头选Auto即可，这也是软件启动时给出的默认值。

 全部照片导入后，使用影像编辑栏中的编辑工具，可对相片进行调整次序、删除、旋转、复制等操作。如果个别照片的方向错误或没有对齐，可以按“手动调节”按钮，进行手动调整。在弹出的面板中，可以对图片进行简单的锐化、明亮度调节；为了保证图片大小一致，请将Zoom选择成“Fit to window”。

３．缝合图片
这一步骤是将前面所抓取的多幅图片无缝地连接在一起，形成一个360度全景的“场景”图。操作非常简单，只需你点击第二个“Stitch”大图标，PixMaker程序会自动地处理图片的边界对齐和连接，在一个弹出的处理窗口中可以动态地看到自动处理图片的全过程。在缝合之前请先确认Type被设置为Cylindrical,而且已经勾选了后面的360。

完成后的场景图片会显示在下面的窗口内（见图1下面窗口）。缝合工作完成后，在下方的显示区域即会出现一幅360°环绕Pixaround立体场景，这个场景会自动以360°环绕播放。用户也可以用鼠标做顺时针或逆时针浏览。
 
此时你就可以用鼠标指针操纵图片，欣赏刚刚生成的360度旋转的全景影像了。横向拖动鼠标可以左右移动图片，按住“Shift”键并上下移多鼠标指针可以放大和缩小“场景”的影像。使用场景窗口左下方的工具条也可以操纵场景图片的放大、缩小和使场景自动旋转，用鼠标指针点击场景图片内任一位置，可停止场景的移动，操作方式非常灵活方便。其中“+”代表放大操作，“-”代表缩小操作。单击演示栏右上方的按钮可以进行全屏观察。

如果你对自动生成场景图片的边界连接效果不满意，也可以选择手动方式人为调整图片的边界连接。

４．在场景内增加热点链接
为了增强360°环绕Pixaround立体场景的观赏性，可以通过HotsPot技术为该场景连接另一幅360°环绕Pixaround立体场景或是其他的多媒体元素。要开启此功能，点击HotsPot标签。启动HotsPot功能后，在HotsPot类型一栏中可选连接至另一个Pixaround立体场景。

在场景图片制作完成后，点击“HotSpot”标签，这时会出现一个提示对话框，要求你首先要保存所生成的场景图片，对话框内要求你选择图像的质量和图片的尺寸，我们在这里选择图像质量为：“good”（较好）一项，图片尺寸选择：“Optimize for web”（按网页使用优化）一项，按“NEXT”按钮，在出现的文件保存对话框中将场景图片保存到指定目录下。接着出现的提示框要求你将目前编辑的工程文件保存到指定的目录下，以方便你以后的修改和编辑。完成以上的操作后就出现了热点编辑窗口，和一个工具条，我们点击第二个命令图标，它是在场景图片上增加一个指向网页的链接，在出现的对话框内填入链接的页面地址和热点提示的内容，按“OK”按钮完成一个热点链接，可以在场景上增加多个链接热点，每一个热点在场景上显示为一个小图框，以提示你点击的位置。

５．将场景发行到网页上
如果对缝合后的效果满意，可以点击界面上的Publish按钮进行场景的发布。用PixMaker Pro制作的场景，可选择以Scene(.jpg,.pij,.bmp,.tif,.png)、Web page(.html)、Postcard(.exe)、Screen Saver(.scr)、PDA(Palm OS 或PPC)、ActiveX以及Print等方式发布。其中发布成Scene和Postcard都可以设置图像输出的质量和大小，如果没有这些参数特殊的要求，可以选择“Use customized settings” 。

这里讨论的最终目的就是将360度的场景图片显示在网页上。首先点击窗口上方的“Publish”（发行）大图标，在对话框中选择“web page (.html)”一项，按“NEXT”按钮，任选一种网页模板，按“NEXT”按钮，在对话框中填入标题和有关的说明文字，并在对话框的下面选择网页上显示场景图片的长、宽尺寸，按“NEXT”按钮并给文件取名为：mypage.html保存生成的网页文件到指定的目录下，接着又出现一个对话框，它提示你在保存页面文件的目录下，程序同时将一些必需的文件也拷贝到此目录，因为PixMaker程序在网页上显示图片是靠“Java applet”小程序支持的，注意！你要认真地记下这些文件名，并在以后将页面上传到你的服务器上时，一同将这些文件上传到与包含全景图片页面相同的目录下，这样才能正常播放“场景”图片。如果你想将“场景”图片插入到你现有的网页中去，用一个文本文件编辑工具打开由程序生成的页面文件，直接将“<applet >…….</applet>”标记内所包含的内容粘贴到你自己的页面内适当位置就可以正常使用了。而且这部分语句中有关“applet”小程序的参数如：显示宽度－width、显示高度－height、自动滚动速度－autoPanSpeed 等对应的数值都可以直接手工修改。

至此，就完成了在网页上制作一幅全景图片的全过程，其中大部分操作都是由“PixMaker”程序自动完成的。还可以将全景图片生成到一个可执行的“EXE”文件中，可单独地播放全景图像。