Add relief to your maps

Recently we added two new vector layers for relief visualisation: hillshade and contour.

Hillshades

Hillshades are dark and light areas allowing us to see relief.

Since last year, hillshades are available as raster layer. The rendering is great and can be done dynamically. However the main issue with the raster-dem layer is that the shade value (dark or light) must be computed for every pixels by the client from a raster-dem tile.

This means that the client has to download the raster-dem tile (hundreds of KB) and then compute the shade value for each pixels. All of this makes the process slow and consumes a lot of bandwidth.

The new hillshade vector layer contains those dark and light areas as pre-computed overlaid polygons making the rendering process on the client much performant. First the vector tile to download is much lighter than the raster-dem tile (a few tens of kilo bytes) and then the rendering comes down to filling a polygon with the right color (black or white)

Contours

Contour lines, or isolines are lines where each point is at the same altitude. Contour lines are used in topographic maps for the representation of relief.

The contour vector layer contains the contour lines as polygons with the corresponding elevation. On the client, the rendering consists of drawing the lines of the polygons. Then we emphasize one line out of five by increasing its width and by rendering its altitude.

Add relief to your maps.

The simplest way to add contours and hillshade to your maps is to use our jawg-terrain style:

Or if you have a custom style, you can add hillshade and contours in few steps in the Jawg lab style editor:

1. First go to the style editor.
2. Create or update a style.
3. On the bottom left panel named Details, tick the Hillshade checkbox. Then disable the HD (raster-dem).
4. On the same panel, tick the Contours checkbox.
5. Optionally you can customize the contours color. On the right panel Palette, select Advanced then Lands and finally enter a color for Contour.