Skip to content
Home
Third-Party Libraries
MapLibre GL JS
Examples

MapLibre GL JS Examples

Show an Elevation Profile in MapLibre GL JS
Elevation - Elevation Profile
Show a route on a MapLibre GL map with an interactive elevation profile.
Add a Geocoder Search Control to MapLibre GL JS
Geocoding - Geocoder Search
Add a geocoder search control to a MapLibre GL map using the maplibre-gl-geocoder plugin.
Draw an Isochrone Polygon in MapLibre GL JS
Isochrone - Walking Area
Fetch a walking isochrone and draw it as a filled polygon on a MapLibre GL map.
Draw a Car Route in MapLibre GL JS
Routing - Route Display
Calculate a car route and draw it on a MapLibre GL map with turn-by-turn markers.
Add 3D Terrain in MapLibre GL JS
Terrain Tiles - 3D Terrain
Display a Maptoolkit terrain tile map with 3D terrain using MapLibre GL JS.
Display Vector Tiles in MapLibre GL JS
Vector Tiles - Basic Map
Display a Maptoolkit vector tile map using MapLibre GL JS.
Add a Temperature Layer in MapLibre GL JS
Weather - Temperature Layer
Add a temperature heat map layer from the Weather API to a MapLibre GL map.
Use Maptoolkit with react-map-gl and MapLibre GL JS
React with react-map-gl
A Maptoolkit vector map in a React app with react-map-gl.
Add a Style Switcher to MapLibre GL JS
Draw and Edit Shapes in MapLibre GL JS with Terra Draw
Draw and Edit Shapes
Draw, edit and delete shapes, and export them as GeoJSON.
Use Maptoolkit with Vue and MapLibre GL JS
Vue with vue-maplibre-gl
A Maptoolkit vector map in a Vue 3 app with vue-maplibre-gl.
Build a Route Planner with Turn-by-Turn Directions in MapLibre GL JS
Route Planner
Drag A or B to reroute, and hover a step to see it on the map.
Use Maptoolkit with ngx-maplibre-gl in Angular
Angular with ngx-maplibre-gl
A Maptoolkit vector map in an Angular app with ngx-maplibre-gl.