基础

单张
MAKE PANO (NORMAL) droplet
针对标准全景图(360度),默认立方体最大尺寸为2200像素,一次性载入场景,可在templates/normal.config进行修改。没有皮肤,只有全景,可用于HTML5 iPhone/iPad 。适用于单张全景。

MAKE PANO (MULTIRES) droplet
生成渐进分辨率的全景,无尺寸/像素限制,快速动态地载入场景,带有按钮的默认皮肤,可用于HTML5 iPhone/iPad 。适用于单张全景。

MAKE PANO (FLAT) droplet
针对平面2D全景或图片,生成渐进分辨率的平面图,无尺寸/像素限制,带有针对平面图片的皮肤和控制,可应用于flash和HTML5。

  • 经测试,前两种展示效果几乎一样,通常用第一种即可
  • 最后一种就是把原图展示了出来,因为减少了切图的过程,生成速度会快很多
  • 如果同时拖进多张图片,会给每张图生成一个文件夹
  • 如果原图不是标准的全景图,会要求输入图片类型和水平范围,因为这种情况下生成的场景会扭曲,影响体验,所以要尽量使用标准的全景图

多张
MAKE VTOUR (NORMAL) droplet
MAKE VTOUR (MULTIRES) droplet
MAKE VTOUR (VR-OPT) droplet(推荐)

自动生成可漫游的全景,将所有的全景图同时投放到droplet上,生成自动缩略图的默认皮肤,可用于HTML5 iPhone/iPad 。

类型
1=Flat, 2=Spherical, 3=Cylindrical
- 2d图
- 3d球面图(上下左右浏览)
- 3d柱形图(横向浏览)

结构

  • tour.html #主页
  • tour.swf #flash基础控件
  • tour.js #h5基础控件
  • tour.xml #场景配置文件(场景元素、样式、事件)
  • panos #加工后的3d图片(原图的切片集合,每张图的切片对应一个以该图片名字命名的tiles文件夹)
  • plugins #拓展文件
  • skin #皮肤配置文件和相关的图片(主要是场景中的按钮及其参数,主文件是“vtourskin.xml”)
  • 平时主要使用的是“tour.html”、“tour.xml ”、“skin”

运行流程
- 将图片拖到相应的app上就会在图片目录生成vtour文件夹,新的会覆盖旧的
- 使用app自带的模拟器或者上传到服务器,可预览效果
- 由“tour.html”进入,其中引入“tour.js”、“tour.swf”和“tour.xml”
- 由“tour.xml”加载场景,其中引入“vtourskin.xml”
- 由“vtourskin.xml”加载皮肤

注意
- 全景图片要用专门的全景摄像机来拍,才能达到最好的效果
- 标准的全景图片的四个边能够融合成一个图像完整的封闭的球面
- 全景图呈现的应该是拉伸的效果,一些原本是直线的区域会因为拉伸而变得弯曲
- 浏览器的开发工具是无法通过“sources”查看xml资源的,得由“tour.html”找到xml,或者是“network”
- 所有的效果都是通过div标签的style属性实现的,从html获取到的就是一堆有着各种style的div,除了style之外无法获取更多信息

你可能感兴趣的:(krpano)