Year 2 Shader Project, using THREE.JS to both generate and texture a 3D terrain scene. Available at THIS LINK (opens in new window) CAUTION: This is a WebGL project and requires your browser to have it enabled. The textures are also rather large, so expect a loading delay. Screen shots are provided below.
Technical Details
Utilising THREE.js, the creation of a responsive terrain mesh, the shape of which is modified by application of a Perlin noise generator (simplex) in the vertex shader. This terrain mesh is the result of a combination of 3 weighted noise values AND an offset reflecting the User’s navigational input. The terrain is then textured by a complex blending of multiple (normal mapped) textures. The problem of “height layering” of these textures has been solved by adding an additional noise value (“moisture”) to effectively produce discrete biomes. All variables are user controllable using a DAT-GUI.
Screenshots
