使用threejs实现3D全景漫游

            最近发现谷歌相机蛮好玩儿的，可以通过拍摄多幅照片将其合成一张全景图，于是我在宿舍中拍摄了宿舍内和阳台的两张全景图，并使用threejs实现了全景漫游。

        只是一个简单的全景场景浏览比较简单，就是创建一个球往里面贴一个全景图。为了实现比较好的交互，能够通过点击鼠标实现漫游效果，我对其中的技术进行了一定的思考与总结。

         首先我们来总结一下用户的交互过程：打开网页、等待全景图加载出来、通过鼠标点击滑动移动实现360度观察、点击按钮去下一个场景、等待全景图加载出来、观看场景。。。。。。那么这个过程有哪些地方是可以优化的呢？通过考虑和对其他全景网站的观察（百度有一个近距离看兵马俑的全景漫游网页就很震撼：https://baikebcs.bdimg.com/baike-museum3d/qinshihuang/index.html）我想到了一些优化的地方：

        1.首先加载过程不应该是只出现一个滚动条或是黑屏让用户等待，因为全景图比较大我自己拍的这两幅都分别是在4~5MB，必然会有一个较长的加载过程，最好是先给用户一个模糊一些的全景图，等大图加载好了在进行替换，这就像是JS网页中的lowsrc。

PS：我开始想的做法是使用LOD技术或是mipmap技术，然后突然想明白了，在客户端做文章是没有任何意义的，主要的费时不是在内存而是在网络传输，所以需要在服务器做好高清和低清两种分辨率的图片进行传递。

        2.点击切换场景最好是给用户一种走过去了的感觉，这种感觉需要两步来实现，点击按钮后将视角锁定朝向，慢慢缩小视角范围，这个过程结束之后在进行场景转换。

        3.对用户的指示牌可以使用标志板技术，这种技术简而言之就是使一个板子始终面对摄像机的方向。将标志板固定到需要展示的地方，当成一个指示牌供用户来点击。

        4.标志板的纹理我使用Canvas进行绘制，只需要在程序中修改文字，直接在Canvas中绘制出来贴到标志板上面，我还将其进行了封装方便下次使用。

        代码要是讲就太多了，重要的我都写了注释，大家需要的话可以在Github下载~

        Github：https://github.com/StringKun/ThreeJSPanorama

效果演示：stringkun.github.io/threejs_quanjingtu/index

        还有就是手机照相没有固定的三脚架，有的地方照花了~这个和程序无关