摘要：
bump Map 主要用于增加表面的法向量细节。例如一个平面其法向量处处相同，即使使用了纹理，光照下的表现仍然不够真实。这时可以扰动表面面片的方向量，从而形成比较真实的光照效果。类似于地形生成，可以通过分形的方法生成平面表面的随机高度， 接着根据高度生成每个位置的法向量。这里使用512*512的纹理... 阅读全文
摘要：
上一节采用 分形算法生成地形的高度值， 接着我们需要生成每个顶点的法向量。three.js 的PlaneGeometry 自带有法向量， 法向量分为两种 即 平面法向量 和 平面每个定点法向量。因此一个n*n 块组成的平面， 有n*n 个平面法向量， 有4*n*n 个顶点法向量。这两种法向量区别是，... 阅读全文
摘要：
地形生成通常使用高度图， 而高度图的生成可以使用绘图工具，或者通过分形算法生成，例如square-diamond, fbm方法。这里采用简单求平均值+随机波动的方法。对于一个2^n+1 * 2^n+1 的网格， 中心点的高度是四角点的平均值加随机偏移， 边上中点的高度值是边两端点的平均值加随机偏移。... 阅读全文
摘要：
最简单的地形是单一的平面， 这个通过var geo = new THREE.PlaneGeometry(2, 2, 256, 256) 几何体构建， 可以设定平面的切分块的数量。var pmesh = new THREE.Mesh(geo, material);可以为平面提供纹理， 从而是地面看起来... 阅读全文
摘要：
LOD 处理比较大的外部地面场景中比较有用， 一般用于绘制地形。 首先通过可视体的切割删除不用的地形块，接着通过LOD 对照相机不同距离的地形块进行层次细节调整。这里采用最简单的LOD 方法。首先地形有n*n 的块构成， 这些块共同构成一个大平面；首先根据每个块到照相机的距离 计算细节层次，例如假设... 阅读全文
摘要：
同一个场景中可以有多个摄像机，同一个屏幕缓冲区可以分块绘制不同的物体。WeblGLRender 中autoClear 设定为false之后， 每次绘制不会清空缓冲区；setSize 设定canvas的大小setViewport 设定绘制的位置的大小clear() 手动清空绘制缓冲区例如有两个摄像机A... 阅读全文
摘要：
Three.js 中3D 物体 都继承于 Object3D;而构造一个3D 物体 需要 提供两个对象 即Gemotry 几何体 和 Material 材质。Gemotry 中 vertices 决定定点的 列表， face 决定面的构成， faceVertexUv 决定 纹理坐标而Material ... 阅读全文
摘要：
WebGLRenderTarget 是GPU 内部对象， 主要作用是存储绘制结果，通常绘制结果直接显示到屏幕上，但是也可以暂时存储在GPU内部，以便于再次利用。对于OpenGL 来讲， RenderTarget就是一个FrameBuffer, 在这个FrameBuffer之下附带有一个颜色buffe... 阅读全文