一、Web3D相关技术
Web3D以浏览器作为展示终端，内容部署在服务端。能够给用户以虚拟现实的交互体验，从不同角度观察对象（物体或场景）。目前常见的实现方式有以下：
1.1 三维建模与实时渲染
这种方式先用三维建模工具构建三维模型和场景，然后将其转为适合前端浏览器浏览的格式。在浏览器端，利用内置的webGL或通过专用插件（例如Unity）加载三维模型，响应用户的交互指令（切换视角、观察点），实时渲染出画面。
三维实时渲染的例子可参见华多秀的虚拟展厅：
| 建模工具 | 3dMax、 Maya |
| 浏览工具 | Unity3D插件、WebGL |
| 优点 | 效果连续、可*漫游场景或以任意视角观察物体 |
| 缺点 |
对用户端显卡性能要求较高 要获得精致的细节、建模成本较高 |
1.2 360实景
通常是在现实场景中，在特定的离散观察点，用相机+云台拍摄多张影像并合成全景图，合并方法可以是圆柱投影或立方体投影。谷歌街景就采用了这种交互方式。
考虑到Web浏览的带宽限制，针对不同分辨率进行金字塔切片。
前端组件根据用户交互输入、加载相应的切片。
上述的虚拟场景也可以利用虚拟摄像机输出全景图。
360实景的例子，可参阅杭州工艺美术馆的在线展厅
http://www.zgdjss.com/unity/vr360/hzmg/tour.html
| 建模工具 | 云台、相机、全景图片制作软件 |
| 浏览工具 |
Krpano 跨终端的浏览插件 |
| 优点 | 建模成本较低、与真实场景完全一致 |
| 缺点 |
观察点离散 |
1.3 360旋转
Ajax-Zoom所谓的360Ratation 在技术实现上有点类似于360实景，所不同的是360实景是观察角度在转动，而360旋转则是：观察点和角度不动，让被观察对象旋转。
如果说360实景是用来表现观察点身处场景内的景象，360旋转则是观察点位于观察对象之外，让对象自身转动，呈现不同角度的外观。
两种技术都可以应用于博物馆展览，360实景适合展厅漫游，而360旋转则适合表现单件藏品。
通过转台+近距离高清拍摄，360旋转可以实现比现场更清晰的web展示，还有一点是现实展览做不到的——看背面。
二、Ajax-Zoom的坑
Ajax-Zoom有几个优点：
1. 兼容PC和移动终端各种主流浏览器
2. 比较完整的解决方案，包括了热区（点）编辑器（Hotspot ediotr, example33.php）、局部视图及切片（Crops）编辑器、批量预处理（Zoombatch.php）
3. 性价比不错：500张图以下，每张图不超过3.2M像素，免费！ 普通的应用买199欧的license足够了。
下面说说我实施过程遇到的几个坑：
. 官方例子中没有采用透明背景的png，但要弄出比较炫的效果，这个是必不可少的，比如下面这个效果：
需要多个层叠加：
最上层的AZ控件透明背景+ 不透明文字和红框+半透明文字框背景色+ 虚化overlay + 底层被虚化的全屏AZ控件。
如果要弄这个，目前的版本会遇到几个坑。
a. 从底层AZ控件热点弹出的overlay，不能覆盖底层的Image Map和Navi bar。两个Image Map和Navi bar同时挂在天上，官网的例子没有出现这样的问题，是由于弹出窗口的底色覆盖了底层AZ的Image Map和Navi bar。窗口底色透明，问题就出来了。
咨询售后之后，确定为z-index问题，增加以下css解决：
.axZmHotspotOverlay{z-index:506 !important;}
b. 加载热点定义js文件，例子中采用jQuery.fn.axZm.loadHotspotsFromJsFile，该函数没有开放对加载进来的热点的修改回调方法，而项目实施中，根据业务规则批量处理热点应该是很常见的需求。
我用Jquery的js加载+更底层的jQuery.fn.axZm.createNewHotspot 函数，自行加载和创建热区，创建之前可以根据业务需要，批量修改或微调热区定义。
c. 官方文档说：用于切片处理的图形库 GD2+或IM可以二选一，而实际上，目前的AZ版本+GD2无法正常处理透明png图的切片。售后说将在下一版本解决此bug。
我们用IM代替GD2获得解决。
三、参考
更细节的搭建环境，可参考我同事的博客文章
http://clover-whd.iteye.com/
效果图是“方禾尖牙” 的作品。