目的 记录 threejs 中常用几何体 记录 threejs 提供的比较奇葩的主题 记录心得 几何体 1、定义顶点 在 Threejs 中,根据 前章:点线面 中所说,点是由一组向量表示,代码为:THREE.Vector3( x, y, z )。 2、常用几何体 常用的几种几何体,Threejs 给与了定义: (1)立方体

(2)平面

(3)球 …

Read More →threejs学习三杠一:点线面然后是体


目的 从图片到纹理 多重纹理 用canvas作为纹理 纹理的更新 纹理 纹理对于我们多么重要。就如我们人类有皮肤一样,物体也有他们的 “皮肤” – 纹理。纹理之于 3D 世界,就如同皮肤于动物世界一样。3D 世界的物体有了纹理,才能那么的美丽。 1、纹理的组成 3D 世界的纹理是由图片组成的,或者说是贴图。将纹理以一定的规则映射到几何体上(一般是三角形上),那么这个几何体就有纹理皮肤了。 纹理是怎么实现的呢?之前学习过 OpenGL 的时候,纹理是通过着色器(shader)完成图片对 …

Read More →threejs学习七:纹理=皮肤


目的 了解如何使用光源 区别各种光源 Threejs的光源 我们看到的景象都是趋于光的反射,才生成的。有的物体会发光,有的不放光,会自发光的物体叫做 光源,例如太阳、点灯等。 在 Threejs 中,有了光,物体才会有光暗的效果。 1、光源基类 在 Threejs 中,光源用 Light 表示,它是所有光源的基类,其构造函数为:

非常简单,只有一个参数 hex,接受一个 16 进制的颜色值。如红色 0xFF0000 [c …

Read More →threejs学习六:有光世界才有色彩


目的 了解两种相机类型:透视相机和正投影相机 学习设置相机的不同参数,使场景显示不同的角度 Threejs的相机 1、相机的种类 在 Threejs 中相机表示为 THREE.Camera,它是相机的抽象类,其子类有两种相机,分别是正投影相机:THREE.OrthographicCamera 和透视投影相机:THREE.PerspectiveCamera。 正投影相机的效果就是没有焦点的投影,近远高低比例都相同(我的理解);透视投影相机就是有焦点,会有近远景的效果的投影。 例如:工程建筑领域、初 …

Read More →threejs学习五:相机


目标 让场景中的物体动起来 设置性能监视器 动起来的场景 1、动起来的原理 如何才能让场景的物体动起来? 利用现实例子来说明:我们看风景的时候,风景怎么动起来。 第一种方法:风景自己动起来。 第二种方法:我们自己动起来(应该说眼睛的移动)。 很好理解,这里代入一下,风景就是 Object 自身,也就是物体自己。我们的眼睛就相当于与 Camera。 2、渲染循环 关于物体移动还有一个关键的地方,就是要渲染物体运动的每个动作,才能显示给观看者,也就是需要不停的调用渲染器的 render() 函数。 …

Read More →threejs学习四:动起来