基于WebGL的三维场景开发与应用的研究
发布时间：2021-01-21 08:21
随着计算机科学的飞速发展,我国互联网技术也有了突飞猛进的进步。在互联网相关应用中,三维模型展示功能作为一种新兴手段,符合了当代人民对生活质量更高的需求。如今市场上的一些可以进行三维模型展示的系统,往往都依赖于APP软件或者客户端,但额外的安装过程给用户带来了多余的使用步骤,对许多用户来说并不值得特地安装这些应用端来体验三维展示效果。如果有一款方便、快捷、使用简单的三维模型展示系统,将很大的提高对用户的吸引力。三维模型展示功能在家居的设计与销售上具有巨大的潜力,针对目前市场上大多数家具的销售都是以图片的形式进行展示这一特点,本文研究并开发出一款三维全景家具展示平台,弥补了家具销售中三维模型展示方面的空缺,同时以基于Web端的开发方式避免了用户使用时还得下载额外应用程序的繁琐步骤。本文通过基于WebGL的Three.js技术实现了家具在网页上的三维全景展示效果,用户可以自行上传室内实景图,选择家具模型来展示在以实景图为背景的三维空间中,并能够与家具模型进行交互,通过对家具模型进行平移、旋转、缩放等操作摆放出想要的家居效果。三维空间中的高度或深度数据通常情况下很难获得,需要一系列复杂的三维重...
【文章来源】：成都理工大学四川省
【文章页数】：83 页
【学位级别】：硕士
【部分图文】：
场景中各元素的关系图
在 WebGL 中使用正交投影照相机来实现，场景中的效果就像是一个数学中常见的基础长方体，如图2-2 所示一样。图 2-2 平行投影效果图平行投影的视景体（Frustum）也是一个长方体，它的特点是当空间中相机位置发生距离变化时，其视景体中所产生影像的大小并不会随之发生改变（姜玲燕，2013）。Three.js 提供了平行投影构造函数，通过在页面中直接引用来实现平行投影：THREE.OrthographicCamera(left,right,top,bottom,near,far)，函数中的六个参数
图 2-3 平行投影视景图矩阵公式如公式 2-1 所示，width 代表相机eye 代表相机所在位置，eye 的下标表示在表示投影里的近平面与远平面，在视景体能
【参考文献】：
期刊论文
[1]JSON与XML动态转换研究及应用[J]. 刘立,赵建军,张锦鹏,余进. 软件导刊. 2018(11)
[2]基于Ajax技术和JAVAEE的分页查询优化[J]. 林萍,朱婵. 计算机系统应用. 2017(08)
[3]基于WebGL的交互平台设计与实现[J]. 汪浩,田丰,张文俊. 电子测量技术. 2015(08)
[4]HTML5-下一代Web开发技术[J]. 李国华. 大众科技. 2015(07)
[5]浅谈Node.js异步编程中回调和异步调用的区别[J]. 李梅. 通讯世界. 2015(06)
[6]基于WebGL的三维WebGIS场景实现[J]. 朱丽萍,李洪奇,杜萌萌,王莹. 计算机工程与设计. 2014(10)
[7]一种基于OpenCV的高效车牌识别系统实现[J]. 刘云鹏,李瑾,潘闻. 电子世界. 2014(09)
[8]一种快速的可变形物体的碰撞检测算法[J]. 谭睿璞,赵伟. 计算机工程与应用. 2014(09)
[9]基于WebGL的三维数字水利展示系统研究[J]. 周阳,佘江峰,唐一鸣. 测绘与空间地理信息. 2014(03)
[10]Display Method for Online Bookstore Emulating Real Bookstore by WebGL[J]. Kazuhisa Yanaka,Terumichi Iizuka. Journal of Electronic Science and Technology. 2014(01)
硕士论文
[1]基于机器视觉小麦叶片含水量检测研究[D]. 周田田.山东农业大学 2017
[2]基于Threejs技术的虚拟校园设计与实现[D]. 王芳芳.浙江工商大学 2017
[3]虚拟现实中碰撞检测算法研究[D]. 刘丽.天津大学 2014
[4]基于WebGL的海洋样品三维可视化的研究[D]. 高辰飞.中国海洋大学 2014
[5]基于Unity3D的虚拟校园设计[D]. 周超.湖北大学 2014
[6]企业级信息系统快速开发框架的设计与实现[D]. 李巍.上海交通大学 2013
[7]基于OBB包围盒的碰撞检测算法改进[D]. 黄可.西南大学 2011
[8]当代数字动画前沿技术解析[D]. 程雅倩.山东师范大学 2010
[9]虚拟现实中基于组件的碰撞检测技术研究[D]. 王祎.吉林大学 2005
本文编号：2990819
【文章来源】：成都理工大学四川省
【文章页数】：83 页
【学位级别】：硕士
【部分图文】：
场景中各元素的关系图
在 WebGL 中使用正交投影照相机来实现，场景中的效果就像是一个数学中常见的基础长方体，如图2-2 所示一样。图 2-2 平行投影效果图平行投影的视景体（Frustum）也是一个长方体，它的特点是当空间中相机位置发生距离变化时，其视景体中所产生影像的大小并不会随之发生改变（姜玲燕，2013）。Three.js 提供了平行投影构造函数，通过在页面中直接引用来实现平行投影：THREE.OrthographicCamera(left,right,top,bottom,near,far)，函数中的六个参数
图 2-3 平行投影视景图矩阵公式如公式 2-1 所示，width 代表相机eye 代表相机所在位置，eye 的下标表示在表示投影里的近平面与远平面，在视景体能
【参考文献】：
期刊论文
[1]JSON与XML动态转换研究及应用[J]. 刘立,赵建军,张锦鹏,余进. 软件导刊. 2018(11)
[2]基于Ajax技术和JAVAEE的分页查询优化[J]. 林萍,朱婵. 计算机系统应用. 2017(08)
[3]基于WebGL的交互平台设计与实现[J]. 汪浩,田丰,张文俊. 电子测量技术. 2015(08)
[4]HTML5-下一代Web开发技术[J]. 李国华. 大众科技. 2015(07)
[5]浅谈Node.js异步编程中回调和异步调用的区别[J]. 李梅. 通讯世界. 2015(06)
[6]基于WebGL的三维WebGIS场景实现[J]. 朱丽萍,李洪奇,杜萌萌,王莹. 计算机工程与设计. 2014(10)
[7]一种基于OpenCV的高效车牌识别系统实现[J]. 刘云鹏,李瑾,潘闻. 电子世界. 2014(09)
[8]一种快速的可变形物体的碰撞检测算法[J]. 谭睿璞,赵伟. 计算机工程与应用. 2014(09)
[9]基于WebGL的三维数字水利展示系统研究[J]. 周阳,佘江峰,唐一鸣. 测绘与空间地理信息. 2014(03)
[10]Display Method for Online Bookstore Emulating Real Bookstore by WebGL[J]. Kazuhisa Yanaka,Terumichi Iizuka. Journal of Electronic Science and Technology. 2014(01)
硕士论文
[1]基于机器视觉小麦叶片含水量检测研究[D]. 周田田.山东农业大学 2017
[2]基于Threejs技术的虚拟校园设计与实现[D]. 王芳芳.浙江工商大学 2017
[3]虚拟现实中碰撞检测算法研究[D]. 刘丽.天津大学 2014
[4]基于WebGL的海洋样品三维可视化的研究[D]. 高辰飞.中国海洋大学 2014
[5]基于Unity3D的虚拟校园设计[D]. 周超.湖北大学 2014
[6]企业级信息系统快速开发框架的设计与实现[D]. 李巍.上海交通大学 2013
[7]基于OBB包围盒的碰撞检测算法改进[D]. 黄可.西南大学 2011
[8]当代数字动画前沿技术解析[D]. 程雅倩.山东师范大学 2010
[9]虚拟现实中基于组件的碰撞检测技术研究[D]. 王祎.吉林大学 2005
本文编号：2990819
本文链接：https://www.wllwen.com/jingjilunwen/jianzhujingjilunwen/2990819.html
