EN DE
  • Sign up
  • Log in

Leaflet with grayscale map

Map

Code

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
    <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
    <script type='text/javascript'>
      function initMap() {
        const host = 'https://maps.omniscale.net/v2/{id}/style.grayscale/{z}/{x}/{y}.png';

        const attribution = '&copy; 2025 &middot; <a href="https://maps.omniscale.com/">Omniscale</a> ' +
            '&middot; Map data: <a href="https://www.openstreetmap.org/copyright">OpenStreetMap  (Lizenz: ODbL)</a>';

        let map = L.map('map').setView([53.14, 8.22], 13);
          L.tileLayer(host, {
            id: 'your-api-key',
            attribution: attribution
          }).addTo(map);

        map.attributionControl.setPrefix(false);
      }
    </script>
  </head>
  <body onload='initMap()'>
    <div id='map' style='height: 400px; width: 400px;'></div>
  </body>
</html>

Help and Service

  • Register • Login
  • Interactive map
  • Plans and Pricing
  • Help, Documentation & API
  • Available projections

About us

  • Legal
  • Terms and Conditions
  • Privacy

Contact details

Omniscale GmbH & Co. KG
Moltkestraße 6a
26122 Oldenburg
Germany
Go to contact form ↝

Copyright © 2025 • Omniscale, Map data: OpenStreetMap (License: ODbL)

* This offer applies only to businesses. All indicated prices are listed without VAT.