Drawing maps using a text editor

Fri, 28 Dec 2018 15:11:00 +0000

To calm myself I like to "draw" maps. This is one of them. Try exploring it.

View it in the terminal

curl -s https://glow.li/map | less -RS

16-color fallback

curl -s https://glow.li/map16 | less -RS

To make working with the map a lot easier, I created recipes that generate only small sections of the map. Because I don't always have to regenerate the whole map, and don't have to find the place every time it gets much faster. This also means that there are recipes for almost all interesting (hand drawn) places on the map.

Drawing the map

While I did draw maps using GIMP before, I wanted something more portable, as in I could do it in the terminal and my phone using #termux. That's why this map is "written". The source file will look like weird text, and then a converter will convert it into colors and Unicode symbols.

w,.(Port Kalau)aa.a..
w,BB.bbbbBbb...aa....
w,xb.xxxxxxxbba.a....
w,xxxxb.b.bxxx+++++++
w,xbu.wwwwwjwb..wwwww
wLxubbw.b.bxwwwww....
w.b...wxxxxx++++++...
wwwwwwwxbayyy+yyy+...
wwwssBB7₄+yyy+yyy+...
wwwsssxx.+yyy+yyy+...
wwwssBB3.+++++++++...

At first the source will look like gibberish, but it's actually always just one letter per tile.

Map key

╔══════════════════╦════════╦══════════╗
║         Legend for Mapmakers         ║
╚════════╦═════════╩════════╩══════════╝
 w ≈ water 
 W ~ water_shallow 
 D ≈ water_deep 
 , ░ sand 
 . " grass 
 i ▓ snow 
 l ░ lava 
 y ▉ farmland 
 U ░ dirt 
 ; ░ gravel 
 a ● forest on grass 
 ä ● forest on plaza 
 â ● forest on sand 
 u * palmforest on sand 
 ü * palmforest on plaza 
 ú * palmforest on grass 
 b ▘ building 
 B █ multiblock_building 
 L ◘ lighthouse 
 O ○ Well 
 g ⌂ gravestones 
 m ▲ mountain 
 s █ plaza 
 S █ plaza_connecting 
 x ┃ street 
 0 ╋ street_crossing 
 - ━ street_h 
 | ┃ street_v 
 1 ┓ street_1 
 2 ┏ street_2 
 3 ┛ street_3 
 4 ┗ street_4 
 5 ┳ street_5 
 6 ┻ street_6 
 7 ┫ street_7 
 8 ┣ street_8 
 ╹ ╹ street_10 
 ╻ ╻ street_11 
 ╺ ╺ street_12 
 ╸ ╸ street_12 
 9 ▪ street_none 
 + ╷ dirtroad 
 ₀ ┼ dirtroad_crossing 
 ~ ─ dirtroad_h 
 ! │ dirtroad_v 
 ₁ ┐ dirtroad_1 
 ₂ ┌ dirtroad_2 
 ₃ ┘ dirtroad_3 
 ₄ └ dirtroad_4 
 ₅ ┬ dirtroad_5 
 ₆ ┴ dirtroad_6 
 ₇ ┤ dirtroad_7 
 ₈ ├ dirtroad_8 
 ₉ ▪ dirtroad_none 
 ╴ ╴ dirtroad_9 
 ╶ ╶ dirtroad_10 
 ╵ ╵ dirtroad_11 
 ╷ ╷ dirtroad_12 
 r ║ rails 
 ⁰ ╬ rails_crossing 
 = ═ rails_h 
 § ║ rails_v 
 ¹ ╗ rails_1 
 ² ╔ rails_2 
 ³ ╝ rails_3 
 ⁴ ╚ rails_4 
 ⁵ ╦ rails_5 
 ⁶ ╩ rails_6 
 ⁷ ╣ rails_7 
 ⁸ ╠ rails_8 
 ⁹ ▪ rails_none 
 ⒑ ═ rails_10 
 ⒒ ═ rails_11 
 ⒓ ║ rails_12 
 ⒔ ║ rails_13 
 c ╫ street-rails-crossing 
 C ╪ street-rails-crossing-vertical 
 * ╵ waterway 
 ⑮ ╴ waterway_9 
 ⑯ ╶ waterway_10 
 ⑰ ╵ waterway_11 
 ⑱ ╷ waterway_12 
 ⑩ ┼ waterway_crossing 
 ⑪ ─ waterway_h 
 ⑫ │ waterway_v 
 ① ┐ waterway_1 
 ② ┌ waterway_2 
 ③ ┘ waterway_3 
 ④ └ waterway_4 
 ⑤ ┬ waterway_5 
 ⑥ ┴ waterway_6 
 ⑦ ┤ waterway_7 
 ⑧ ├ waterway_8 
 ⑨ ▪ waterway_none 
 q ═ bridge 
 j ║ bridgev 
 p ▐ pool_right 
 P ▌ pool_left 
 o ● pond 
 F ✈ airplane 
 t . animal 
 ? ? label 
 $ $ debugger 
 E E error 
 N N null space for testing 
 ¬ ▗ wall 
 ᴬ ▐ wall_v 
 ᴮ ▀ wall_h 
 ᴰ ▜ wall_crossing 
 ᴱ ▜ wall_1 
 ᴳ ▐ wall_2 
 ᴴ ▀ wall_3 
 ᴵ ▝ wall_4 
 ᴶ ▜ wall_5 
 ᴷ ▀ wall_6 
 ᴸ ▜ wall_7 
 ᴹ ▐ wall_8 
 ᴺ ▝ wall_10 
 ᴼ ▗ wall_11 
 ᴾ ▝ wall_12 
 ᴿ ▘ wall_12 
 ᵀ ▜ wall_none

Difficulties with certain formats

The generator can generate many different formats, but piping the ANSI-colored output to less -RS is the best way.

PNG

It can technically do PNG, and it's doing that for generating the tiles for the interactive map, but displaying the whole map as a single PNG would use about 6 Gb of video RAM and a really beefy computer to render. I tried; eventually my computer will run out of RAM before completing. That's why I even bothered with the tiled map.

Repository

You can view the generator and the map source in this repository. If you want to make your own town in my map, shoot me a pull request.

https://github.com/Neo-Oli/fantasymap

How I got the initial map

The original template for the map was generated with this fantasy map generator. This huge PNG I indexed to a few colors.

This file I then converted into the X PixMap file format

/* XPM */
static char * /home/glow/fantasymap/map_xpm[] = {
"1000 500 6 1",
"   c #130903",
".  c #1A0707",
"X  c #09E1F4",
"o  c #5C3D06",
"O  c #245950",
"+  c #DCCECE",
/* pixels */
"iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii[...]",
"iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii[...]",
[...]

After this I just copy-and-replaced a few things and ended up with the blank map, to which I added towns streets and did large scale landscaping.

glow.li: Map