通过使用Three.js支持的Panolens.js、Pano.js或photo-sphere-viewer.js等插件，可以创建全景图片查看器。然而，在uniapp中，这些H5插件不能直接应用，但可以借助web-view组件引入HTML来实现。在uniapp项目中，创建一个HTML文件，引入查看器插件的JS，并配置全景图片路径。在web-view组件中引用这个HTML，经过调试，H5端、模拟器和真机都能正常运行，只是小程序端存在兼容性问题。
全景图片查看器，有了Three.js的支持，已经是很简单的东西，网络上相关的插件有很多，这里推荐几个：Panolens.js、Pano.js、photo-sphere-viewer.js，这些插件都是基于Three.js，我这次是用的是photo-sphere-viewer.js。
但是使用这些插件，都是H5端的，uniapp中不能直接用。但uniapp有个组件web-view，可以引入内部或外部的HTML，文档传送：web-view。那这样问题思路就很清晰了，写一个HTML，使用查看器插件，再在uniapp项目中使用web-view组件，将本地的HTML导入。。。很简单吧
而且，查看器的使用也是巨简单，
引入两个js文件，
写个放插件的div，js中new一个插件对象，放上全景图片路径，完事儿~~其他具体的参数请去熟读并背诵文档
接下来就是在uniapp项目中引入，阅读web-view文档，我们能看到：
说明HTML文件不是随便放的，有特定的文件路径
最低0.47元/天 解锁文章
扫一扫
708
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
