MapLibre (Vector Styles API)

MapLibre is a popular map rendering library, which uses client-side rendering based on vector tiles.

To use our maps with MapLibre, you’ll need:

An included version of the maplibre-gl.js library.
A div element where the map will go.
A small amount of JavaScript to initialize the map.
Your choice of map from our list of maps available using our Vector Styles API.
Your API Key.

Here’s a code snippet showing how to add our Atlas map to your site:

<script src="https://unpkg.com/maplibre-gl@3.6.2/dist/maplibre-gl.js"></script>
<div id="map" style="height:300px"></div>
<script>
    var map = new maplibregl.Map({
        container: 'map',
        style: 'https://api.thunderforest.com/styles/atlas/style.json?apikey=<insert-your-apikey-here>',
        center: [-0.09, 51.505],
        zoom: 5
    });
</script>

Some of our maps are only available through our Map Tiles API, and MapLibre supports raster layers too! We have a separate tutorial for using MapLibre with our Map Tiles API

MapLibre (Vector Styles API)

Demo