It's that time of the week again,
This is the second in my
3D Game Making series of tutorials using Conitec's free
Lite-C engine. We finished the last tutorial with a 3D terrain that we used the arrow keys to pan around...
... In this installation you will learn how to generate your own landscapes from a
heightmap image and a few extra textures. Next time we'll look at how to add
entities (Level objects) and give them physical properties. To add to the eye candy factor I will also cover how to add a sky and atmospheric fog.
Tip: If you've not looked at my first tutorial I would recommend doing so, however, if you're experienced with programming in other fields you only need give it a brief glance, however, it does contain all the information about essential programs and their pros and cons.Part 4 - HeightmapsTutorial PrerequisitesI mentioned some new software in my
homework hints at the end of the last tutorial. If you haven't already, go and grab yourself a copy of
terrain texture generator. You'll also need an image editor of your choice (I will use The GIMP for the duration of this series).
First things first,
what's a heightmap?- A heightmap is a grayscale image where the brightness of a pixel represents the height of the 3D terrain relative to that pixel. White areas are high up whilst black areas are low down.
The best way to explain the concept of heightmaps is to look at examples:
 |  | Look at how the brightness translates to the level of the terrain in the 3D view. |
 |  | Inverted Smiley Face: Just to prove a point. |
 |  | This one I mercilessly plagiarised off Google Images. It's fairly realistic, there's a demonstration of it working in the Lite-C engine in another one of my projects. If you look around you can find some tools that can create very realistic heightmaps. Some people use satellite imagery in their games.
You can find this heightmap here. |
 |  | Just for fun. This one has a texture added 
You can download the .hmp here. |
Now let's have a go at making our own:
- In your favourite imaging program, create a heightmap (say 256x256 pixels in size) and save it as a .bmp anywhere you want.
- What we want to do now is create a texture to go on our terrain. In theory we could just draw one in an image editing program but in practice that would look really bad. The best way is to get a program to do it for you, blending between layers. A program that can do that is Terrain Texture Editor.
- Start up Terrain Texture Editor and you will be welcomed with a window as below:
Terrain Texture Generator, a great free tool for generating the texture to go with your heightmap.
- As you can see it has loaded a heightmap already. To get to grips with what the program does, press the Build Texture button and when prompted - save the resulting texture wherever you want.
- Now press the 3D preview button and observe.
A texture appiled to a terrain made from a heightmap.
- Now try loading your own heightmap and generating a texture. Notice that you can change the resolution of the texture that is generated. This is particularly useful if you are making a large landscape, however, most graphics cards do not support textures higher than 2048x2048 so bear that in mind.
Texturemap size/resolution.
- Once you've generated a texture for your heightmap, save it as a .bmp and fire up MED. In MED, go to File > Import > Terrain From Image
- Locate your grayscale heightmap and click ok. You will be prompted to change some parameters as below:
 | Let's discuss these parameters and what they mean:
Horizontal and Vertical Vertices
The heightmap image is interpreted by MED. A generated plane is composed of points in space called vertices. The more you have, the more accurate the plane is. The height of each vertex is relative to the brightness of the heightmap image. You should probably aim to use between 100 and 200 vertices as the dimensions are multiplied together to yeild the total number of vertices. So a 100x100 .hmp has 10,000 vertices. A 200x200 one has 40,000 so you have to watch how many use because ridiculous numbers of vertices put unneccesary stress on your 3d hardware.
Triangle Size Horizontal and Vertical
This is the size of each square of vertices in quants. Increase these values if you want to scale your terrain around the X and Y plane. You will have no idea of the scale of things until you use your hmp in the engine so a little experimentation is required.
Warp Animation
Check this box if you want to make an animated terrain with waves (you can add a terrain as an entity on top of your existing level).
Z-Position
These are multipliers for the RGB values of your heightmap. Since the one we are using is grayscale we can multiply them all by the same number, say 10. |
Click OK and your terrain will appear in MED. The texture may look a bit funny, but you can ignore that - we'll fix it later.
- If you think your terrain looks a bit shallow you can stretch it in the Z-direction. Press the select button
and select the whole terrain in one of the bottom (side view) viewports. Then select the scale 
tool.
- Scale by dragging the Z-handle in a downwards direction. Your terrain should get greater in height (See below)
Before:
After:
Once you're happy with the shape of your terrain, it's time to apply a the texture you generated earlier. Go to
Edit > Manage Skins.
- Select Skin0 and click Skin Settings The following window of parameters will appear.
 | Under texture, click ... and load up the terrain texture you made earlier. Close both windows and your terrain should have the texture applied to it. If not go back and check over the previous steps. |
- Save your terrrain as my_terrain.hmp or something like that, in the directory from last tutorial's project.
Here's the code if you're unsure, change the name of the terrain to that of your own and click run (The black play button).
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
| #include <acknex.h>; //You need these includes at the start of your main script.
#include <default.c>;
STRING* numstring = "";
var framespassed = 0;
TEXT* test_textbox = { //Add a text object
pos_x = 10; //X position relative to top left
pos_y = 10; //Y position relative to top left
font = "Arial#18"; //Font and size size
flags = SHADOW | visible; //Flags alter text behaviour
string("Frames passed:",numstring); //Strings to be displayed.
}
function main()
{
//This section happens once when the function is run initially
level_load("PUT THE NAME OF YOUR TERRAIN HERE.hmp");
wait(3); //Wait required for level load
while(1)
{
//This section happens every frame due to a while loop.
framespassed++; //incrememnts variable by 1
str_for_num (numstring, framespassed); //makes string from variable
camera.pan -= 5*time_step*(key_force.x); //pan the camera by the time_step
camera.tilt -= 5*time_step*(key_force.y); //pan the camera by the time_step
wait(1);
} |
If all goes well you should have your own terrain that you can pan around. If not go back and check the instructions or PM me with your code and perhaps a screenshot of your game if it runs.
HomeworkNext time we're going to add an entity to our terrain and give it some behaviour. If you want to get a head start press F1 in SED and have a look at the chapters on entites and their properties, perhaps c_move commands and if you're feeling ambitious - Lite-C's built in physics engine.
Next Date?I'm not sure when the next tutorial will be because article timing is changing at the moment but I will try my hardest to get it out for the same time next week.
Also: If you've actually had a go at my tutorials I'd like to hear from you.
