backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2025-12-17 17:51:24 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Completely re-worked for v 0.9b

Azgaar 2019-06-10 15:01:24 +03:00
parent 63e9986cea
commit c7a103ea64
1 changed files with 75 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

193
Quick-Start-Tutorial.md

@ -1,151 +1,108 @@
# Quick Start Tutorial # Quick Start Tutorial
_First published in [Bastion Rolero](http://bastionrolero.blogspot.com.by/2018/05/resena-sobre-el-generador-de-mapas-de.html) by Roger Trobanoms. Edited by Kenny Considine_ ![FMG Loading Screen](https://azgaar.files.wordpress.com/2019/06/1.-fmg-loading-screen.png)
## Introduction
_Fantasy Map Generator_ is a tool that creates highly customizable fantasy worlds for you. It runs in a browser and does not require any software installation. It’s free and you can use created maps for any purposes including commercial. You can even download the Generator and then run in a browser without Internet connection available.
_This tutorial is outdated, but still useful for new users._ The tool generates a new fantasy map on opening. The map is auto-generated, but it doesn’t mean that you cannot control the generation. To open the controls click on the arrow button at the top left corner on the screen or press Tab. You can either change the generation parameters and generate a new map, or edit the current map. You can also create a new map from scratch using paint brushes.
![Menu button](https://azgaar.files.wordpress.com/2019/06/2.-menu-button.png)
When we open the Fantasy Map Generator, it shows us a random map by default. We can alter the configuration by accessing the menu in the left top, and then generate a map according to this configuration. ## Moving around
The map is getting generated in a default zoom so that all the map area is displayed on the screen. Double click on the map to zoom into the clicked area. Double click again to zoom into even more. The maximum zoom level is 20x by default, but it can be changed in the options. To zoom out hold <kbd>Shift</kbd> and double click. Use dragging to move around the enlarged area.
The menu is divided in different submenus: _Layout_, _Style_, _Options_, _Customize_ and _About_. We will explain them briefly, although we will not go very in depth in this tutorial. The same operations can be performed using keyboard. Press <kbd>+</kbd> to zoom in, <kbd>-</kbd> to zoom out. Use <kbd>1</kbd>-<kbd>9</kbd> number keys to set an exact zoom level. Press <kbd>0</kbd> to reset zoom to default. Use arrows keys to move around.
## Layout ## Map layers
In this menu you can choose the type of layout for the map: Politics, Cultural, Height map or simply the Outline of the continents. Each type has a series of labels or layers that you can turn on or off: By default the map shows the world’s political situation, but it’s not the only available preset. Open the first tab of the menu – _Style_ – to change the preset. _Preset_ is a set of different map layers being toggled on. There are 5 presets available for selection: political map, cultural map, heightmap, biomes map and the pure landmass view. You can either select one of the presets or use buttons below to display or hide a particular label.
* _Ocean_ ![Map presets and layers](https://azgaar.files.wordpress.com/2019/06/3.-map-presets-and-layers.png)
* _Heightmap_ (elevation of each _Cell_, that can be considered as county or lordship)
* _Grid_ (borders between _Cells_)
* _Overlay_ (hexagonal or square grid, type can be selected in the _Style_ tab)
* _Cultures_ (different from countries)
* _Routes_ (by earth and sea)
* _Rivers_
* _Countries_
* _Borders_ (between _Countries_)
* _Relief_ (icons for mountains, hills, forests and marshes)
* _Labels_ (all types of map text)
* _Burgs_ (settlements icons).
![Screenshot_1](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_1.png)
Each type of presentation has some labels activated and other deactivated by default. We can select which options we want, although usually the default option is the most optimal one. To make it simple each of the layers has a hotkey assigned. Hover mouse over the layer button to see a tooltip showing what the button does and which key is assigned to it. Check [the Hotkeys]( https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Hotkeys) wiki-page to get a full list of shortcuts.
## Style Some layers are sort of a background and may not be visible if upper layer is toggled on. You can drag the layer button to change the layers order.
Those with a flair for the fine arts will see that the map’s style easy to configure. You simply choose the element that you want to modify in “Select element”. For each element you can define a colour of the palette, a level of opacity, and a filter. The filters are:
* _Blur_ with different degree of blurring ## Styling and filters
* _Splotch_ (spotted texture) There are cases when you may want to see multiple background layers simultaneously. The only way you can do it is to make the upper layer partially transparent. Choose the required layer from the _Select element_ drop-down list and change the opacity slider.
* _Shadow_ (add drop-shadow)
* _Pencil_ (slightly distort layer to resemble handwriting)
* _Turbulence_ (heavily distort layer).
Besides, you can apply one of the following filters to the entire map: _Grayscale_, _Sepia_, _Dingy_ and _Tint_. The same approach is used for styling all the map elements. For example if you want to change the color of state borders, select _Borders_ element and click on color box to set a new color. Here you can also change the borders stroke width, its style and apply a visual filter. Different map elements have different styling controls.
![Styling borders](https://azgaar.files.wordpress.com/2019/06/4.-styling-borders.png)
![Screenshot_2](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_2.png) Using the section below the styling drop-down you can apply a filter to the whole map.
## Options
You can define a lot of options that will allow you to adapt the map to what you want. If you don’t want a parameter to be random, click to make the lock closed.
The main difference between this menu and the others is that, in order to see the changes made in this menu, you have to generate a new map (the 'New Map' button at the bottom of the menu). In Layout, Style, and Customize, you can make changes and see them in the map immediately. ## Performance tips
Some users report performance issues on map dragging and zooming. There are number of tips that will allow you to avoid problems with performance.
* Toggle off unnecessary layers. Please especially take care of the _Relief Icons_ layer – it’s the most resource-demanding one.
* If you have a wide screen, open the Generator in a separate browser window, make it _much_ smaller (about 900 x 560 pixels) and re-generate the map. Then zoom in to see the map in details. It will reduce the rending area and improve the performance drastically.
* Generate maps with _Points number_ = 10K. Points number highly affects performance.
* Toggle off map and element filters.
* Close all irrelevant browser tabs and applications.
* Use the top-edge browser. As for now the best performance is observed in _Chrome_. _Firefox_ is also pretty fast, but there are some minor UI issues specific to this browser.
The options that you have in this menu are the following: ## Saving the map
If you like the current map you will probably want to save it for a later use. There are 3 saving options:
* _Save as .map_. It is an internal file format that stores all the map data including your manual changes. It can be them loaded directly into the Generator and used to proceed with the map creation. I highly recommend saving the map you are working on at least every 30 minutes. The generator is still in beta and critical error with data loss or even browser crash may happen.
* _Save as .png_. It makes a screenshot of the currently displayed map fragment. Just an image and nothing more. The png resolution can be set in the _Options_ tab. By default it is 5x of the map size. Saved file can be opened and edited in any image editor.
* _Save as .svg_. It is a vector image that can be rescaled to any size without quality loss. The Generator naturally renders maps in svg, so there is no conversion and hence saving as svg is better than saving as png. To just open and view a saved file I recommend using your browser, not a vector images editor. To edit the file you need special software – the most common are _Inkscape_ (free) and _Illustrator_ (proprietary).
![Saving options](https://azgaar.files.wordpress.com/2019/06/5.-saving-options.png)
* _Map size_: allows you to indicate the height and width (in pixels) of the map. By default the map tries to fit the screen size Please note all these 3 options use popups for saving. So please allow browser to show popups for the site and ensure they are not blocked by _adBlocker_. Please don’t worry, there is no ad on the site.
* _Map cell density_: defines underlying graph size. Big sizes will make the map more detailed, but only the default size (1) works well with random maps and has good performance ## Generation and UI settings
Let’s move to the settings overview. Open the menu and open the _Options_ tab. There are multiple options split into 2 categories: map generation and user interface. Map generation options require a new map generation to be applied. UI options are getting applied immediately on change.
![Options](https://azgaar.files.wordpress.com/2019/06/6.-options.png)
* _Heightmap template_: allows you to choose the type of heightmap that you want for your map. It can be Volcano, High Island, Low Island, Continents, Archipelago or Atoll * _Map size_: the size of the map canvas. By default the map size is a browser window size, but it can be changed to any value. The button on the right expands the size back to the window size. Please note that size the map was generated with cannot be changed later
* _Map seed_: a number defining random values generation. If options and map size are the same, two maps generated with the same seed will be exactly the same. Obviously, map seed cannot store user’s changes, so please don’t use seed number as a save function
* _Points number_: a number of generated cells. The more points are generated, the more detailed is map. Points number highly affects performance, so the only recommended value is 10K
* _Map template_: a set of rules applied on heightmap generation. Basically a type of the landmass to be generated: high island, continents, archipelago etc. You can create your own template or change the existing in the _Template Editor_ (part of the _Heightmap Editor_ tools)
* _Cultures number_: a number of cultures to be generated. Cultures then can be edited via the _Cultures Editor_
* _States number_: a number of countries to be generated. States then can be edited via the _States Editor_
* _Size variety_: defines how much states area should be different. The lower value, the more uniform stare areas are
* _Growth rate_: defines how far states and cultures will expand into neutral lands on generation. The lower value you have, the more lands will stay politically neutral
* _Towns number_: a number of towns to be generated. Towns are non-capital settled areas (_burgs_). If there is not enough suitable space to put a requested number of towns, the Generator will place only a limited number of towns
* _Burgs count_ and _States count_: allows you to define the number of settlements and countries that you want to be generated. The generator will place all if there is enough land space User interface options:
* _Interface size_: size of the control panes
* _Tooltip size_: size of the tooltips displayed at the bottom of the screen
* _Transparency_: opacity of the control panes
* _PNG resolution_: relative size of the png image saved. 1x means the downloaded image will have the same resolution as map size, 2 – 2x larger and so on
* _Zoom extent_: minimal and maximal zoom levels. Click on the button on the right to restore the default values
There is also the _Reset to defaults_ button. The button cancels all user changes and refreshes the page.
* _States disbalance_: allows you to establish the maximum size difference between countries (with a low value, all the countries will tend to have the same size) ## Climate configuration
Click on _Configure World_ to set up map position on a globe and world climate. Toggle biomes, precipitation or temperature layers on to see how changes affect the world.
![World Configurator](https://azgaar.files.wordpress.com/2019/06/7.-world-configurator.png)
* _Neutral distance_: the distance between places considered neutral. With a low value there will be a lot of neutral space between countries The Globe on the right shows relative position of the map as a brighter area. The position is getting calculated based on two inputs: _equidistance_ and _equator_. The North is always on the top, the West is on the left and so on. Equidistance controls the distance from equator to poles in pixels. Equator is Y coordinate of the line in pixels. It’s easier to understand with an example. Let’s say the map has Y size equals to 1000. The Equator Y is set to 500, so the Equator will lie through the map center. The equidistance is 750 pixels, while the top and bottom edges of the map are distant from the Equator in 500 pixels. It means that the map covers the area between 60°N and 60°S latitudes.
* _Cultures count_: allows you to define the number of cultures to be generated. Cultures will be randomly selected from the default list of 13 currently available ones The map latitude affects the temperature gradient and winds applied to the map. You can change the temperature on Equator and Poles and it will be re-calculated based on map position on a globe. To change winds use the arrows on the right. Please note that wind is also latitude-dependent.
* _Precipitation_: the higher the value, the greater the number and size of rivers The _precipitation_ value defines how much vapor can clouds bring and spread across the map. The bigger the precipitation value, the greater number of rivers and fewer deserts you get. With precipitation equals to 0 all the map will be an unlivable desert.
* _Swampiness_: the higher the value, the greater the number of marshes ## Heightmap editing
If you don’t like the heightmap generated automatically, you may edit it or even create a new one from the scratch. Open the _Tools_ tab in the menu and click on _Heightmap_. Now you need to select an edit mode. All secondary data like rivers, burgs and state depend on the height values, so changing the height manually will break the default generation logic. So the best practice here is to use the _Erase_ mode, create the heightmap you want and let the system to re-generate the secondary data based on a current heightmap. It will remove all the changes made for burgs rivers and so on, but it will guarantee the smooth generation.
![Heightmap Editor](https://azgaar.files.wordpress.com/2019/06/8.-heightmap-editor.png)
* _Ocean layers_: choosing more layers makes the ocean have more visual levels of depth. See the [.gif](https://i0.wp.com/azgaar.files.wordpress.com/2018/07/coast_outline_types.gif) If you want to perform just a minor change, you need to select the _Keep_ mode. You won’t be able to change the coastline, but all the data, including manually placed relief icons and rivers, will be kept as is. So it’s more like a visual change without changing the basic data. This mode is also safe.
The options below work immediately after changing and control general parameters: If you have manually edited data and still need to change the coastline, you may use the _Risk_ mode. As the title says, it’s not safe and can cause some issues. So please use this mode only if you really need.
* _PNG resolution_: set relative size of the downloaded .png image (screenshot). Big size is very detailed but can be slow on downloading and opening Heightmap editing process has multiple build-in tools. These tools won’t be covered in this tutorial, just note that they allow you to use brushes to “paint” the map, to edit and apply heightmap template and to convert any image into a heightmap.
![Paint Brushes](https://azgaar.files.wordpress.com/2019/06/9.-paint-brushes.png)
* _Zoom extent_: map zooming limits, the default minimum zoom is 1, maximum is 20. ## Customization tools
The Heightmap Editor tools are not the only available ones. From the same _Tools_ tab you can also open Biomes, States, Cultures, Namebase, Burgs and Units editors. All these Editors work in a different way and won’t be covered in this tutorial.
![Screenshot_3](https://i2.wp.com/azgaar.files.wordpress.com/2018/08/quick_start_3_v3.png) The same tab contains tools to re-generate map elements. If, for example, you have added and moved some burgs, the burgs won’t be connected with roads anymore. You can click on initiate routes regeneration to get them connected. You can also re-calculate State Labels positions, relief icons, population, rivers, burgs and states.
## Customize The next _Tools_ section allows adding elements like burgs, labels, rivers, routes and markers. Select the tool and then click on the map to add an object. Hold <kbd>Shift</kbd> and click multiple times to get several objects added.
This is, by far, the part that can require more work. It is not that difficult, but requires dedication. In the first part of the menu, under the title _Customize_, there are three submenus: _Heightmap_, _Countries_, and _Scale_.
![Screenshot_4](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_4.png) The last section, which in collapsed by default, provides some info about the hovered map cell.
### Heightmap ## Editing map elements (labels, rivers, roads etc.)
On _Heightmap_ click the customization options are getting displayed: Individual map elements such as rivers, routes, relief icons, labels, burgs and labels can be edited on mouse click. The editor screen that is getting opened is different for each element and it’s also out of this tutorial coverage.
![Label Editor](https://azgaar.files.wordpress.com/2019/06/10.-label-editor.png)
* _Edit_: change the current Heightmap. It has two sub-options: _Clean up_ and _Keep_. Edit mode shows a colour for each cell which indicates its altitude above sea level (so-called heightmap) ## Points of contact
That was a pretty brief overview of the main Generator elements and approaches. It’s not full by any meaning and just serves as a starting point. You can always find more details and help on our supportive [Discord server]( https://discordapp.com/invite/X7E84HU) and [Reddit community]( https://www.reddit.com/r/FantasyMapGenerator/).
> General map customization rule is that the Heightmap should come first. If you have already started to work with secondary elements like burgs and countries, you can still edit the heightmap by selecting the _Keep_ option, but you risk bugs or other issues appearing. So the better option is to select the _Clean up_ option, which will erase all the secondary data and regenerate it on heightmap completion
* _Clear all_: this erases all the heightmap and you will have to draw it from zero. Sincerely, I do not recommend it unless you want to start a map creation from the scratch
* _Complete_: when you finish your height configuration, you have to click here.
Afterwards you have a series of tools that add some levels of complexity. We will not describe them one by one because this tutorial would quickly become 25 pages. As a summary, we will say that when you select the _Edit_ button, you will see the map in the Heightmap mode. Then a box of tools will appear that allows us to alter cells altitude, in other words give them more or less height with respect to the sea level.
![Screenshot_5](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_5.png)
Finally, there are three special tools: an If that allows you to change the height using certain conditions; another that softens all height changes, and another that changes randomly all the cells’ altitudes.
For additional info see a [dedicated wiki-page](https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Heightmap-customization).
### Template Editor
This is definitely an advanced feature. It allows you to modify the height templates mentioned above (Volcano, Island, etc.), so that the map is generated following these new instructions. We will not explain that here in this quick tutorial.
![Screenshot_6](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_6.png)
The interesting thing is that, if you configure a template, you can save it and use it in the future. This way you will not lose the work you have done.
### Image Converter
Another advanced feature. It allows to load an image and turn it into a map. We won’t go into this either, but it is good to know that it is available, in case you have a map drawn and want to digitize it, or want to re-create a well-known fantasy world.
### Perspective View
This feature does not seem me especially interesting since it apparently does not allow you to export the image with quality. We can see the map in perspective, but as I already said it doesn’t seem very interesting yet. Consider it a concept of a planned 3d preview feature.
### Countries
When we go into this submenu a list with all the countries is displayed. For each country we have information on its color, name, capital, number of burgs, number of cells, area and population.
Almost every parameter is editable. In the lower part of the menu we have the controls that allow us to do many changes, which are outside of the scope of this tutorial.
![Screenshot_7](https://i0.wp.com/azgaar.files.wordpress.com/2018/08/quick_start_7_v2.png)
Something to take into account is that we can download a list of all countries and related data as a _.csv_ file. The file can be opened in MS Excel or even Notepad, and then you can edit it and then load to a generator to fetch data.
One more hidden jewel is the _Burgs Editor_, that is opened by clicking on the "circled bullet" icon (⦿) for any country. From this screen you can easily edit burg names, re-assign the capital, change population and so on.
![Screenshot_10](https://i0.wp.com/azgaar.files.wordpress.com/2018/08/quick_start_10_v2.png)
### Cultures
This option works the same way as Countries Editor. For each culture we have information on its color, name, number of cells, area and namesbase. To edit a culture placement we can simply drag the displayed _culture center_ circle, but this will not allow any precision. For small changes we can manually re-assign cultures using _paint brush_.
![Screenshot_11](https://i0.wp.com/azgaar.files.wordpress.com/2018/08/quick_start_11.png)
A namesbase is a thing that makes one culture different from others. Namesbase defines a set of data to be used for a procedural name generation. For example _German_ base contains a list of citynames in real-world Germany and some basic generation rules like preferable name length and generation method. We can also create our own namesbase or edit an existing one.
![Screenshot_12](https://i0.wp.com/azgaar.files.wordpress.com/2018/08/quick_start_12.png)
### Scale
Finally, we can change the unit of measurement, the distance represented by each pixel of the map (2 miles per pixel, for example), the population density and the degree of urbanization of the countries.
![Screenshot_8](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_8.png)
## Export the map
At the bottom of the menu are the options _New Map_, _Save as_, _Load_ and _Reset Zoom_.
You can save the map in the formats _png_ and __svg__. I recommend the last because it is smaller in size and has a much better quality. It’s a vector format, so it can be losslessly rescaled to any size. To manipulate _svg_ you can use the program _[Inkscape](https://inkscape.org)_, that is completely free.
![Screenshot_9](https://i0.wp.com/azgaar.files.wordpress.com/2018/05/quick_start_9.png)
If you want to go back to edit the map in the future, you can save it in the _map_ format. This way, you can go back to the page, load your _map_ file and continue editing.
You can do the same with the modifications that you have done. As we already commented, you can download the data of the countries in format csv and the heightmap template.