Monday, February 3, 2020

New Mountain Style (Part 9)

In previous posts I described drawing a new style of mountains and using them to fill mountain areas on a map with a mountain chain and some surrounding mountains:
Creating the mountain chains requires (smartly) connecting the ridgeline of one mountain to the topline of the next mountain.  I realized while implementing this that I could apply the same idea to my existing mountains, which can look quite different but also have ridgelines and toplines:
So in theory I should be able to use the same approach to filling mountain areas using my old-style mountains.

To do this requires some serious re-factoring.  The mountain chaining functions need to be modified so that they take some kind of mountain object which provides all the required functionality -- including things like drawing a new mountain, moving the mountain, getting the topline and ridgeline and so on.  This is a minor refactor for the new mountain codes, but substantially more involved for the old mountain code.  The old mountain code doesn't organize the mountain pieces in quite the same way -- for example, there's no specific ridgeline (there can be none, or many).  It also doesn't support moving mountains around in the way that is required for chaining.  In the old mountain code, a mountain is moved by applying an SVG transformation.  This moves the mountain on the screen, but lines that make up the mountain don't actually change.  I need them to change so I can check for intersections with other mountains and so on.

Both the old and the new code represent mountains as Javscript structures.  I probably should refactor them both to create real Javascript objects, but for various reasons I stopped somewhat short of that level of refactoring.  Instead I have three functions I pass into the mountain chaining code (make a mountain, move a mountain and draw a mountain) and I make sure that the mountain structure itself has all the required parts.

With these changes in place I can draw the example map from above using the old style mountains.  Here's the first working image:
That's a surprisingly good/interesting result (although it looks a bit Dr. Seuss-ish).  The mountain chains are very evident, and in the parts of the mountain chains where the angle is conducive they look pretty good.  These mountains are smaller than the new style mountains, so there are many more in the mountain chain, which is most evident in the long nearly vertical stretch in the upper mountain chain.  Making the mountains bigger will help with that.  There's also a problem with how the mountains are overlapped -- the algorithm is overlapping them based upon the mountain centers, when it really should be the lowest point on the mountain.  This is making the mountains overlap too much.

Here's a revised version with those two fixes:
This is still a little busy in the vertical stretch but otherwise looks pretty good.  Here's an example in color with a different style of shading:
Note that by default the old-style mountains don't always have a ridgeline, or have one that fades out before it reaches the next mountain in the chain.  This somewhat dilutes the visual impact of the continuous ridgeline throughout the chain.  The mountain chaining code actually indicates to the mountain drawing code that a mountain is in (or not in) a chain, so I can use this to force the ridgeline to be drawn for all the mountains that are in the chain:
This makes the chains (versus the surrounding mountains) a little more visually obvious.

Here's another example with different parameters:
One thing to experiment with is the density and overlap of the mountains surrounding the chains.  This can create quite a different feel:
That's probably closer to the density that you see on a lot of fantasy maps, but it tends to conceal the mountain chains.  Something in-between might be better.
Or I can keep them all for different styles.

It occurs to me also that since the new approach draws mountain chains and then fills in around them with random mountains, if I don't draw a mountain chain and just fill in randomly, it's equivalent to the old style of mountain fill.  So I can collapse both styles into one implementation.

This completes the new mountain style.  The map that inspired this style was done in pencil:
Next time I'll make some attempts to create a pencil filter effect in SVG.


  1. When I noticed the mountains on a 1699 Russian map today, they immediately reminded me of your blog! =D


Note: Only a member of this blog may post a comment.