WebGL 开发:光源和投影总结

Three.js内置了多种光源可以直接调用: AmbientLight(环境光) AreaLight(区域光) DirectionalLight(平行光) HemisphereLight(半球光) PointLight(点光源) SpotLight(聚光灯) 首先我们设置好基础的环境: 我的第一个WebGL程序 body { margin: 0; overflow:

- 阅读全文 -

three.js:dat.GUI()

(1)首先在页面的 标签中添加这个库。 (2)定义一个 JavaScript 对象(这里假设叫做 controls),该对象将保存希望通过 dat.GUI 改变的属性。 var controls = new function () { this.rotationSpeed = 0.02; //...... }; (3)接下来需要将这个 JavaScript 对象传递给 dat.gui 对象

- 阅读全文 -

three.js--缩放,平移,旋转矩阵的使用

几何体Geometry对象有一系列的顶点属性,也封装了一系列的方法,通过.scale()、.translate()、.rotateX()等方法可以对几何体本身进行缩放、平移、旋转等几何变换。通过.scale()、.translate()、.rotateX()这些方法对几何体进行变换,注意本质上都是改变结合体顶点位置坐标数据。 使用方法: //创建一个立方体几何对象Geometry var geo

- 阅读全文 -

three.js相机介绍

Three.js中我们常用的有四种类型的相机:PerspectiveCamera(透视相机)、 OrthographicCamera(正交投影相机)、CubeCamera(立方体相机或全景相机)和StereoCamera(3D相机)。 一般情况下为了模拟人眼我们都是使用透视相机,透视镜头则是模拟人眼的视觉特点,距离远的物体显得更小。透视镜头通常更适合3D渲染。 THREE.PerspectiveC

- 阅读全文 -