Map Editor Tutorial - Importing a Heightmap

[R4bitF00t]

In this part, we will go over how you can import a heightmap image into the editor.

Sometimes, you want to have a symmetrical map, or just want to create the layout of your map really quickly.

You can do that through creating a heightmap in an image painting software first, and then importing it into the editor.

 

If you encounter any issues, don't hesitate to ask in Skylords Reborn Map Making Discord.

 

• Content

• Creating a Heightmap
• Importing a Heightmap
• Calculating Height
• Measuring Distances
• Return to Mainpage

 

• Creating a Heightmap

We will need to create an image to serve as our heightmap.
Heightmap images are black and white - with black being 0 height in the editor, and white being the max height we set when importing the map.
In general, you don't want your heightmap to include black color, or have it too dark. If you change your mind about the layout later and want to add some deep chasms, you might find that you don't have enough height left for that.

 

Before we make a heightmap image, we actually need to decide on the map size first.
The reason is that the heightmap resolution MUST be the same as the size of the map.

Why? Because every pixel on the image is equal to one node of the terrain in the editor.

The red dots on the image are the terrain nodes.

If you have a different number of pixels in the image than the map size, the editor cannot use the pixels to deform the terrain nodes.

So stick to 256x256 images for 256x256 sized maps, and 512x512 images for 512x512 sized maps.

Quote

Note: Remember - you should NOT create unequally sized maps, such as 256x512, 128x1024 etc.

When painting the heightmap, I would recommend painting with sharp pixels. If you paint smooth transitions between pixels, the results in the game might not be what you desired - the cliffs generated will be staggered like stairs.
For clean cliffs, you need to have sharp pixels.

 

Quote

Note: When saving the heightmap, be wary of JPEG compression - choose the highest quality, or save the image in PNG format.

This is the heightmap I made for the sake of this tutorial.

Now that we have a heightmap image, we can import it.

 

• Importing a Heightmap

You can import your heightmap through File -> Import Heightmap...

When you select the heightmap you created, you will be greeted by this window.
In here, you can set what white color means in terms of height - note that in this dialogue window, the height is in meters, while in the Height and Cliff tools, the height is in centimeters.

If you have incorrectly sized heightmap, you will get an error when hitting Apply.
We, however, have created a 512x512 heightmap for 512x512 sized map, so our heightmap is imported successfully.

There is one unfortunate thing, and that is we have no cliffs generated. Units will be able to walk over all of these steep hills.
To fix that, we will need our Terrain Cliffs tool.

In there, set up the cliffs you want to use, and with Attach Manually function, paint the cliffs over all the steep terrain.

This is where you might notice the difference between sharply painted pixels, and "smooth" pixels.
On the left are cliffs generated by smoothly transitioning pixels.
On the right are cliffs generated by sharply painted pixels. 

 

You might have to clean up the map after importing your heightmap. If you made any mistakes in the heightmap, simply fix them in the image and import the heightmap again.

 

 

• Calculating Height

Further down the line, you might need to calculate the map height precisely.
We will need math for that (eww).

White color has an RGB value of 255 - when importing, you are asked what white color means in terms of height on the heightmap.
Well, we need to decide on how high each point of RGB value will be - I suggest a nice, whole number such as 20 or 25.

When you want your ground to be 5000 centimeters high, and cliffs to be 6000 centimeters high, you can calculate the value you need to use to paint the proper height.

I will give you an example.
I have decided on height of 25 centimeters per 1 RGB value.
And I want my ground to be 5000 centimeters high and cliffs 6000 centimeters high.

Then I divide 5000 by 25 to get the RGB value of my ground.

5000/25 = 200

So I need to use RGB value of 200 to paint height of 5000 in game centimeters.

To paint my 6000 centimeters high cliffs, I need to calculate the same equation.

6000/25 = 240

So to paint 6000 centimeters high cliffs, I need to paint a RGB value of 240.

Now I need to calculate how high the 255 RGB value will be.

Simply multiply 255 by 25.

255 * 25 = 6375

So, when we want to import our heightmap, we need to specify that white (255) means 6375 centimeters, or 63.75 meters.

Quote

Note: I would suggest you refrain from painting any details or small height differences onto your heightmap. Focus on the macro scale.
You can fiddle with small height details with the height tool.

 

 

• Measuring Distances

I will flat-out tell you, that one terrain node - or one pixel - measures 1.4 meters in game.

To measure distances in the image editor, you will need an editor with the measure or ruler functionality.

Make sure to set the tool up so it measures in pixels.

Afterwards, measure the number of pixels between two points and multiply the number by 1.4.

 

 

• Return to Mainpage

You can return to the Map Editor Tutorial homepage from here.

 

• Map Editor Tutorial Homepage •

 

 

 

Edited February 1 by R4bitF00t