Installation

npm install @geoman-io/maplibre-geoman-free

Usage

import ml from 'maplibre-gl';
import { Geoman, type GmOptionsPartial } from '@geoman-io/maplibre-geoman-free';

import 'maplibre-gl/dist/maplibre-gl.css';
import '@geoman-io/maplibre-geoman-free/dist/maplibre-geoman.css';

const map = new ml.Map({
  container: 'dev-map',
  style: {
    version: 8,
    glyphs: 'https://fonts.openmaptiles.org/{fontstack}/{range}.pbf',
    sources: {
      'osm-tiles': {
        type: 'raster',
        tiles: ['https://tile.openstreetmap.org/{z}/{x}/{y}.png'],
        tileSize: 256,
        attribution: '© OpenStreetMap contributors',
      },
    },
    layers: [
      {
        id: 'osm-tiles-layer',
        type: 'raster',
        source: 'osm-tiles',
        minzoom: 0,
        maxzoom: 19,
      },
    ],
  },
  center: [0, 51],
  zoom: 5,
});

const geoman = new Geoman(map);

map.on('gm:loaded', () => {
  console.log('Geoman fully loaded');
});

Documentation

Visit geoman.io/docs/maplibre to get started.

Demo

Check out the full power of Maplibre-Geoman Pro on geoman.io/demo/maplibre

Links

• GitHub Repository
• Report Issues
• Pro Version & Pricing

License

MIT