Skip to content
maplibre-yaml

maplibre-yaml

Create interactive maps with simple YAML — no JavaScript required
Get started View on GitHub

See It in Action

Section titled “See It in Action”
A simple map created with just YAML

Why maplibre-yaml?

Section titled “Why maplibre-yaml?”

No JavaScript Required

Define your entire map in YAML: layers, data, popups, legends and stories. For anyone who wants a web map without writing the code for it, and for developers who want to prototype quickly.

Runtime-First

Data is fetched when your map loads, so it can update live. The script is about 175 KB gzip (plus maplibre-gl), and readers for large-data formats download only when a map uses them.

Full MapLibre Power

Access all MapLibre GL features: expressions, data-driven styling, 3D terrain, and more.

Framework Agnostic

Use with vanilla JavaScript, Astro, or any framework via web components.

Quick Example

Section titled “Quick Example”
type: map
id: my-first-map
config:
  center: [-90, 38]
  zoom: 3.5
  mapStyle: "https://tiles.openfreemap.org/styles/liberty"
layers:
  - id: rivers
    type: line
    source:
      type: geojson
      url: "https://raw.githubusercontent.com/nvkelso/natural-earth-vector/master/geojson/ne_50m_rivers_lake_centerlines.geojson"
    paint:
      line-color: "#2563eb"
      line-width: 2
controls:
  navigation: true
  scale: true

Choose your path

Section titled “Choose your path”

A map in an HTML page

One HTML file and one YAML file, loaded from a CDN: nothing to install. Quick start →

A story map

A map that moves as the reader scrolls through chapters. Story maps →

Something else, or not sure? See all the paths, including thematic maps, large data and coming from MapLibre.