图形学与3D游戏
文章平均质量分 85
夕阳-晨曦
这个作者很懒,什么都没留下…
展开
-
<Three.js>(第一节)环境搭建
Three.js顾名思义3D的js库。是运行在浏览器的基于webgl的3D引擎。该引擎是github上的一个开源项目,下载地址:https://github.com/mrdoob/three.js/1、搭建一个本地服务器。(本人用的是另外一台mac电脑的自带本地服务器)2、下载three.js库。https://github.com/mrdoob/three.js/准备好前面的操作后,接下来是创建一原创 2016-07-14 17:21:58 · 8067 阅读 · 0 评论 -
<Three.js>(第二节)添加长方体
一、实验内容上一节已经搭好了实验的框架。这一节我们将在屏幕上显示一些几何图形。如下图所示,我们将在屏幕上显示一个正方体。 二、实验步骤1、创建场景 正像上一节所说,首先我们需要建一个场景,场景就是类似舞台,有了舞台演员才有地方表演嘛。新建场景很简单,通过Three.js库提供的Scene类,我们可以新建一个场景对象。正如一下的代码://创建场景scene = new THREE.Scene()原创 2016-07-16 09:26:20 · 4415 阅读 · 0 评论 -
OpenGL编程(六)通过三角形绘画出3D模型
使用三角形绘制3D模型 三角形是基本的多边形,任何多变形都能由三角形组成。三角形是由三个顶点的连线组成。三个点分别是v0;v1;v2。1、绕法 从某个顶点开始,有两种连线的方法,顺时针和逆时针,这是两种不同的绕法。2、连接多个三角形 三角形能拼出任何多边形平面或曲面。所以对于平面或曲面,我们只需要保存组成这个面的所有三角形的顶点以及拼法即可。例如某个面有n个三角形组成,我们需要保存3n个顶原创 2016-08-07 21:50:50 · 9440 阅读 · 3 评论 -
OpenGL编程(七)3D模型的深度(z轴)检测
下图是我们要修改后的效果图: 一、深度检测1、模型Z轴显示有问题: 上一次试验中,如果认真留意,会发现一个问题。当控制锥体在左右或上下旋转时,你会发现锥体看起来是在+-180度之间来回摆动,而不是360度的旋转。锥体的底面总是朝向观察者。这个我们可以通过修改锥体底面的颜色方便观察。如下图: 正如上面的两幅图,在不同的角度看,底面永远都是在最上面。其实这是跟我们前面代码上的画图有关。前面我们原创 2016-08-16 22:29:30 · 4396 阅读 · 0 评论 -
<Three.js>(第三节)全景漫游
一、实验内容通过上次实验,了解了Three.js创建场景的基本步骤。这一节,我们将通过Three.js实现全景漫游功能。如下图: 全景图是获取一个3D场景中的不同角度的图片,然后通过拼接、融合实现3D的虚拟场景。例如百度地图上全景漫游。三、探讨方法1:使用软件(例如:Pano2vr ) 前提准备:下载Pano2vr软件;全景图。 全景图:对于现实世界,可以通过鱼眼摄像头拍摄得到全景图;对于虚拟原创 2016-08-06 21:18:46 · 15460 阅读 · 3 评论 -
OpenGL编程(八)3D数学与坐标变换
笛卡尔坐标一维坐标系以一个点为原点,选定一个方向为正方向(相反的方向为反方向),以一定的距离为标尺建立一维坐标系。一维坐标系一般应用于描述在一维空间中的距离。 举个例子:一维坐标系好比一条拉直的电线(忽略长度),一只老鼠在电线上,对于这只老鼠来说,这个一维坐标系(电线)就是它的世界,只能沿着电线的方向向前或向后运动(当然也可以不动),这只老鼠这个时候是活在“一维”世界里。二维坐标系 百度百科原创 2016-12-10 11:35:24 · 2985 阅读 · 0 评论