Pano2vr6制作全景html5

一、软件介绍

Pano2VR

软件：Pano2VR Pro 6.1.8 WIN版(64位)
教程：https://www.bilibili.com/video/BV1ho4y127nw

软件面板

---

二、导入全景图片

2.1、准备全景图片

2.2、导入图片至软件

通过添加到软件底部导览浏览器

2.3、链接图片（热点）

2.4、编辑热点

热点编辑界面，如何全景图片没有被热点链接起来会提示警告

没有链接报错信息：

2.5、添加图片

2.6、添加视频

---

三、输出文件

3.1、导出和预览界面

3.2、预览界面

3.3、导出文件目录

---

四、皮肤编辑器

4.1、皮肤编辑器入口

4.2、皮肤编辑器编辑

1、选一个默认皮肤，另存为后进行编辑
拖入新的图标，开始配置

4.3、皮肤的使用

选择对应的皮肤ID

效果展示：

---

五、部署

5.1、nginx配置

在ngin.conf里面包含方式：
kele配置文件

include conf/kele.conf;
server {listen 80;server_name www.kele.com;charset utf-8;root D:/Devops/VRPanorama/html5/;index index.html index.htm;# 跨域设置add_header Access-Control-Allow-Origin "*";add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";add_header Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range";# 根目录重定向到默认项目location = / {return 302 /index/;}# 处理所有子目录访问location / {# 优先尝试确切的文件，然后是目录内的index文件try_files $uri $uri/ $uri/index.html =404;}# 特别处理XML文件location ~ \.xml$ {default_type application/xml;add_header Access-Control-Allow-Origin "*";add_header Cache-Control "no-cache, no-store, must-revalidate";try_files $uri =404;}# 静态资源缓存设置location ~* \.(jpg|jpeg|png|gif|ico|svg|webp|js|css)$ {expires 1y;add_header Cache-Control "public, immutable";try_files $uri =404;}location ~* \.(eot|ttf|woff|woff2)$ {add_header Access-Control-Allow-Origin "*";expires 1y;add_header Cache-Control "public, immutable";try_files $uri =404;}# 错误页面error_page 404 /404.html;error_page 500 502 503 504 /50x.html;
}

5.2、访问效果

这里需要将该域名执行这里,更改hosts配置：
127.0.0.1 www.kele.com
通过域名访问：http://www.kele.com/index/index.html