Skip to content

Interactive Web Maps

If you're looking to get started with interactive maps on the web, you're in the right place! Let's get started with the best libraries for 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

  • Leaflet


    Leaflet is probably the best known and simplest of all map rendering libraries. Its gentle learning curve yet powerful APIs make it one of the most popular renderers around. And if the base library can't do something out of the box, check out the long list of available plugins.

    Get Started with Leaflet (Raster)

    Get Started with Leaflet + MapLibre (Vector)

  • 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!