Our new global elevation layer, Terrain-RGB, is live! Encoded in the Red, Green, and Blue channels of these PNG tiles are raw height values in meters. You can use the elevation data stored within Terrain-RGB for a wide variety of applications both visual and analytical, from styling terrain slope and hillshades to generating 3D terrain for video games.
Left: raw RGB, Center: decoded to hypsometric tint, Right: decoded to hillshades
Terrain-RGB uses each color channel as a position in a base-256 numbering system, allowing for 16,777,216 unique values. We’ve mapped these to 0.1 meter height increments, which gives us the vertical precision necessary for cartographic and 3D applications.
Use this endpoint to get Terrain-RGB tiles:
Use this equation to decode pixel values to height values:
height = -10000 + ((R * 256 * 256 + G * 256 + B) * 0.1)
In the following example we’ve used Terrain-RGB to build a dynamic inundation mapping application that visualizes the impact of a rising sea-level. As tiles load, they are decoded and filtered; any pixel under the inundation elevation is colored blue to show areas underwater. (Inundation Map)
The San Francisco Bay area under 10 meters of water. (Inundation Map)
Western British Columbia with a Sea Level Rise of 500 meters. While this scenario is obviously dramatic, the landscape patterns that are revealed are striking. (Inundation Map)
The Gulf Coast with a Water Level of 1 meter above Sea Level.
Elevation brings with it a third dimension. You can use Terrain-RGB to generate 3D meshes and surfaces in your application of choice.
3D mesh wireframe in Unity made with Terrain-RGB
We’ve been having a blast using Terrain-RGB in Unity. You can see the new elevation layer in action, recreating the hills of San Francisco, in Camilla’s “Drive around your map” post.
Watch for more on Mapbox + Unity on the blog and at Unite LA next week! Find us at the conference or drop us a line @Mapbox to talk more about maps and Unity.