My App

Quickstart

Render a published Planisfy style with MapLibre.

Quickstart

1. Pick A Style URL

https://api.planisfy.com/styles/v1/{owner}/{style}
https://api.planisfy.com/styles/v1/{owner}/{style}@{version}

For local Docker Compose, replace the origin with http://localhost:4000.

2. Render With MapLibre

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <link href="https://unpkg.com/maplibre-gl@4/dist/maplibre-gl.css" rel="stylesheet" />
    <style>
      body { margin: 0; }
      #map { width: 100vw; height: 100vh; }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script src="https://unpkg.com/maplibre-gl@4/dist/maplibre-gl.js"></script>
    <script>
      const map = new maplibregl.Map({
        container: "map",
        style: "http://localhost:4000/styles/v1/planisfy/planisfy-streets-light-v1",
        center: [9.1829, 48.7758],
        zoom: 12
      });
      map.addControl(new maplibregl.NavigationControl(), "top-right");
    </script>
  </body>
</html>

3. Check API Access

Published public assets can load without a key. Service APIs require an API key or session:

curl "http://localhost:4000/geocoding/v1/forward?q=Stuttgart" \
  -H "X-API-Key: pk_your_key_here"

4. Publish Your Own Data

Use Console to upload or import data, build a tileset, add it to a style, publish the style, and copy the stable or versioned URLs.

On this page