A Few Notes Before I Get Started

Azgaar’s blog is here. I have used many of his ideas and some of his code in this endeavor.

I have also used ideas and code from, “Christophe Le Besnerais”, his island terrain implementation is located on github here.

Wade Terrain Generator v 0.4

For this version of the WTG, I have implemented a rudimentary, ‘political map’. This includes cities, towns and region coloring based on closest city.

0% Political Map Opacity

50% Political Map Opacity

100% Political Map Opacity

Final Results Preview

When you load the page, you see a blank grey screen with three tabs, (Geometry, Map, Export). The export tab is currently not implemented, so don’t bother with that.

Click the geometry tab and you should see a menu to create a voronoi diagram (the map’s underlying geometry). You can drag the sliders to change the map’s x and y dimensions as well as the approximate radius between polygon centers. Based on your adjustments, the estimated number of polygons will be displayed . Click the build button to create the underlying geometry. You can draw or hide the geometry information as before.

Click the map tab and you should see a menu with three sliders. The generator always creates an island, but you can use the size slider to make the land mass bigger or smaller relative to the surrounding ocean. The second slider controls the amount of moisture that will be created on the terrain. The third slider adjusts the opacity of the political map overlaid on the terrain map. Click the build button to create an island with some terrain features. If you adjust the opacity of the political map, be sure to click the update button. If you instead click the build button, a whole new map will be created. You can use the scroll wheel to zoom the map in our out.

The political map shows cities as large purple circles, towns as smaller red circles and color codes regions based on the closest city. The maximum number of regions is arbitrarily capped at eight.

Note: If you create a map without first creating an underlying geometry, nothing will happen (you’ll see an error if you have the console open). If you create a map, you can change the sliders and then click the map button to erase it and create a new map. Once you create a map, if you change the underlying geometry you will have to rebuild the map to see the changes. It takes about 8 seconds to generate the geometry for 8k polygons and an additional 2-3 seconds to generate the map, so if you click the build button give it a little time to generate.

﻿﻿﻿﻿﻿﻿﻿﻿﻿﻿﻿

What’s going on under the hood?

The ideas for how to implement the political map came primarily from Azgaar’s blog (see reference above), specifically this page. If you look at the code, the following is bundled into WTGPoliticalMap.js. In a nutshell, this is the method to create the political map

When biomes are assigned, each polygon is designated as, ‘habitable’, or not. For example, SNOW, TUNDRA, TEMPERATE_DESERT, have their habitable property set to false. TEMPERATE_DECIDUOUS_FOREST, GRASSLAND, TROPICAL_RAIN_FOREST, have their habitable property set to true. From this information, create an array of habitable polygons

I have arbitrarily chosen 300 as the number of habitable polygons necessary to support a city and 100 habitable polygons as the number necessary to support a town. Based on the number of habitable polygons, calculate the maximum number of cities and towns the terrain will support.

Assign a score to each habitable polygon based on its’ neighboring polygons. If a neighboring polygon is: uninhabitable (-1), river (+1), river mouth or coast or river source (+1).Sort the scored polygons in descending order

Assign the best score to be a city. Get the next highest scored. If that polygon is a minimum city distance apart, assign it as a city. If not, it is a town candidate. Continue to assign as many cities as allowed.

Go through the town candidates. If it is a minimum town distance apart from all cities and existing towns, assign it as a town. If it is too close, discard it. Continue to assign as many towns as allowed.

For all the land polygons on the map, check which city it is closest to and give it a, ‘region color’, based on that cities array index.

Draw big purple circles for city, and smaller red circles for town locations.

Conclusion

As a next step, I think I will try adding pathfinding. This will mean the creation of roads on the political map as well as giving the ability to click on one polygon and get a path to another polygon on the map.

Download and extract the zip file, load wtgDemo.html in your browser to see it in action.

The code contains comments, so I hope it is easy to follow. Feel free to play around and use the code however you want.