Skip to content

Maps for Web

If you're looking to get started with maps on the web, you're in the right place! This guide will help you find the best library based on your preferred tech stack and use case.

React

  • React Leaflet


    React Leaflet is the simplest way to get started building maps in React. It leverages the rich Leaflet ecosystem, and makes it easy to build interactive maps with marker clustering, custom annotations and popups, and more.

    Get Started with React Leaflet (Vector)

    Get Started with React Leaflet (Raster)

  • Custom React Component


    Need more advanced features like 3D perspective or restyling client-side? You can build a component that's customised for your application and data flow using MapLibre GL JS to do the heavy lifting. Our tutorial on the vanilla JavaScript API covers the basics, empowering you to build your own component.

    Learn MapLibre GL JS

Vue

  • Vue Leaflet


    Vue Leaflet is the easiest way to build maps with Vue 3. While you won't get the glitzy 3D effects and vector rendering of MapLibre GL JS, Vue Leaflet leverages the rich Leaflet ecosystem, which makes it extremely easy to build maps with marker clustering, custom annotations and popups, and more.

    Get Started with Vue Leaflet

  • Custom Vue Component


    Need more advanced features like 3D perspective or restyling client-side? You can build a component that's customised for your application and data flow using MapLibre GL JS to do the heavy lifting. Our tutorial on the vanilla JavaScript API covers the basics, empowering you to build your own component.

    Learn MapLibre GL JS

Vanilla JS

  • MapLibre GL JS


    MapLibre GL JS is the most advanced vector tile renderer and supports dynamic styling, 3D perspective, hillshading, and more. Our tutorial will get you started, and point to further examples of how to handle the more complex use cases.

    Get Started with MapLibre GL JS

  • MapLibre GL Leaflet


    MapLibre GL Leaflet gives developers most of the benefits of vector tiles while avoiding the complexity of MapLibre GL JS. For data visualization use cases that don't require things like dynamic re-styling and 3D perspective, this is a much simpler option.

    Get Started with MapLibre Leaflet

  • Leaflet


    Want to use Leaflet but don't care about vector tiles? No problem! Leaflet works just as well with raster tiles, and is the perfect option if you want to keep things light or support older hardware.

    Get Started with Leaflet

  • OpenLayers


    OpenLayers has a dizzying array of features, integrates with many OGC APIs, supports vector layers in multiple formats, and a lot more. If you're a GIS professional, OpenLayers needs no introduction. Stadia Maps is a built-in tile provider from OpenLayers v8.0.0, and is quite easy to use in prior versions.

    Get Started with OpenLayers

Other vector renderers

Our vector tiles use the Mapbox Vector Tile format, and are compatible with several other renderers, but we cannot provide official styles and support for these at the moment.

If you'd like help getting started and your framework isn't mentioned, let us know!