今天在网上看见一个关于制作全景图不错的软件,于是研究一了一下 。
现在记录一下学习心得 :
首先是学习资料
参考:
https://blog.csdn.net/QQ408896436/article/details/60767037
接下来是自己的体验
说明一下我下载的是5.2.5版本 和 参考资料里的版本不一样,但是原理都是一样的。
下载安装这一套直接略过
新建项目
打开软件之后 ,点检红色剪头处的按钮, 选择添加需要制作的全景图片。可以用单张的图片 也可以使用全景拼接的,我这里使用的是一张平面图。
这是全景类型的选择 ,如果是拼接的图片需要选择相应的类型,我这里用的是单一平面图,所以选的是自动。
选完的图就会自动在查看器中合成出全景效果。
这里说两个功能 图片添加 和 交互热点
图片添加
点击查看器侧边栏中的红框中按钮 切换到图片模式 ,然后双击底图即可添加图片。
这些参数都可以根据需求自行设置,也可以直接在查看器中,按住箭头所指的按钮进行操作,设置位置以及旋转角度。
热点交互(多边)
pano2VR里有两种热点交互 一种是‘指定热点’,另一种是‘多边热点’。这里说的是多边热点交互。
我们用选多边热点交互,来给刚刚添加的图片添加一个点击互动。
还是先选中相应的模式,然后在刚刚添加图片的区域添加交互区域。
添加完区域 ,再来设置交互的属性。在左边的属性栏里面的 连接目标网址 输入框里添加 javascript:say(); 这一句。say() 就是需要执行的函数名。然后在目标中选择 _self , 就 ok 了。
这写都完成之后就可以输出html 项目了,这两个地方都可以输出。
点击绿色加号选择HTML,再点击箭头处按钮一路确定即可。
这就是自动生成的项目文件夹
要完成交互还需要再修改一下代码,打开index.html 文件,添加上刚才 say() 这个方法。
最后打开浏览器看一下是否成功
成功输出完事。