Terrain
This post is part of a course on geometric modeling at the Summer Liberal Arts Institute for Computer Science held at Carleton College in 2021.
Let’s riff off the grid you just generated. Instead of keeping the grid flat, with all the z-coordinates at 0, you will randomize them. When the surface is rotated toward the ground, it has the appearance of terrain. Follow these steps to produce your random terrain.
Function
Add a function named generateTerrain. Have it accept the following parameters:
nlatitudes, which is the number of lines of latitude.nlongitudes, which is the number of lines of longitude.width, which measures the horizontal span of the terrain.height, which measures the vertical span of the terrain.depth, which is the maximum elevation of the terrain.
Create your empty positions and triangles arrays. Return them in an object.
Vertex Positions
Generate the positions of the grid with a structure much like you did in generateGrid. However, instead of setting the z-coordinates to 0, assign each a random value. To generate a random number in [0, 1] in JavaScript, call Math.random(). Scale each random number that you get by the depth.
Render your positions as Points. Do you see both the underlying grid on the xy-axes and the random deviation on the z-axis?
Triangles
The vertices connect up into triangles in the exact same was as the grid. You can copy the code directly from that function into this one.
When you render the terrain as a solid, shaded surface, you should see a landscape that you may or may not want to walk around on.