基于web3技术的虚拟展厅设计.docxVIP

内容摘要： 互联网的流行与飞速发展使传统的二维网页已不再满足我们的需求，于是，基于web3d技术的三维网页开始进入我们眼帘。Web3d技术是在互联网中实现虚拟现实相关的技术。这些年来，Web3d技术有了一定成熟的进步，不过相关的资源仍是十分稀少。常见的web3d技术有Flash3d、Unity3d、WebGL等，目前最为简便且流行的则是基于WebGL的three.js。本项目将3d网页与虚拟现实相结合，首先将家装公司的效果模型渲染成正方形全景图，然后再采用web3d全景图技术（html5、JavaScript、Three.js）构建一个室内设计效果的360/180环视查看，接下来通过获取手机设备的位置和动作信息，把手机的屏幕分成左右眼视觉渲染并应用手机中的加速度计、陀螺仪等感应器，使我们只需戴上cardboard便可体验身临其境的VR效果。其展示效果远远超过普通的平面图演示。 关键词：互联网 JavaScript three.js VR Abstract ： The popularity and rapid development of the Internet makes the traditional two-dimensional page is no longer meet our needs, then, based on the web3d technology of 3d page start into our eyes.The Web3d technology is related to virtual reality technology in the Internet.Over the years, the progress of the Web3d technology had certain mature, but the resource is still very rare.Common the web3d technology are Flash3d, Unity3d, WebGL, at present the most convenient and popular is based on the WebGL. This project will be 3d site combined with virtual reality, the first to paint the effect of domestic outfit company model in panoramic view of the square, and then the panoramic view of the web3d technology (HTML, JavaScript, Three. js) build a 360/180 of the effect of interior design around a view, then by getting the location of the mobile devices and motion information, the mobile phone screen is divided into left and right eye visual rendering and use the accelerator and gyroscope sensor in this phone, we only need to wear a cardboard can experience VR effect.The display effect is far more than ordinary plan presentation. Keywords: The Internet, JavaScript, three.js, VR 目录 摘要 I Abstract II 1. 项目综述 ………………………1 1.1项目背景 ………………………1 1.2技术综述 ………………………1 2. 制作全景图 ………………………2 2.1. 全景图 ………………………2 2.2. 渲染全景图 ………………………2 3. three.js场景 ………………………3 3.1. three.js简介 ………………………3 3.2. 搭建场景 ………………………3 3.3. 方案切换 ………………………6 3.3.1. 切换按钮 ………………………6 3.3.2. 切换实现 ………………………7 3.4. 添加音乐 ………………………8 4. VR支持 ………………………9 4.1. WebVR ………………………10 4.2. 效果实现 ………………………10 4.2.1. 加载库文件 …