Tangram is an open-source map renderer designed to grant you ludicrous levels of control over your map design. By drawing vector tiles live in a web browser or mobile device, it allows real-time map design, display, and interactivity.
Using OpenGL, Tangram saddles and rides your graphics card into a new world of cartographic exploration. Animated shaders, 3D buildings, and dynamic filtering can be combined to produce effects normally seen only in science fiction.
Map styles, data filters, labels, and even graphics card code can be defined in a human-readable and -writable plaintext scene file, and APIs permit direct interactive control of the style. You can even modify the scene files in real-time with Tangram Play, our browser-based editing tool.
Because Tangram draws maps live on-screen, you can update styling properties in real-time, instantly. But changing the color is just the beginning – as every Tangram map is a 3D scene, you also have control over lights and cameras.
In this example, an isometric camera’s perspective is varied along with the color and direction of a light, resulting in a time-lapse drone’s-eye view.
Real-time filtering, sorting, and styling
Tangram is designed to use vector data sources such as Mapzen’s Vector Tile Service, which is a tiled, hosted version of the OpenStreetMap database. Besides points and lines, these data sources contain metadata, which Tangram can use to filter the data and adjust drawing styles as it draws the map.
This example sorts and styles roads based on a variety of OSM tags, including “layer”, “tunnel”, and “link” for on- and off-ramps.
This example uses a shader to color geometry with hand-drawn textures, blending between them based on the color, angle, and amount of light on each face.
This map uses procedural shaders to create a view of the future. The textures, defined by mathematical functions, are applied to various data layers with UV maps, the same way you would texture an object in a 3D application.
By combining real-time shading techniques with our free global terrain tilesets, you can take your cartographic styles to new heights by integrating custom terrain layers into your maps.
Even more examples can be found in the documentation’s Demos & Examples page.
Let’s Do This
Making a scene
Our browser-based, real-time text editing tool, Tangram Play, is a great way to work with Tangram scene files.
Tangram is open source, and we welcome contributions via our GitHub repo!