Vector Layer in Leaflet

View the source of this page to see how the map is created.The code to configure the MapTiler vector layer is also shown below:

          const map = L.map('map').setView([54.17747885048963, -6.337641477584839], 16);
          const tiles_url = "https://tileserver.openstreetmap.ie/styles/ga/style.json";
          const mtLayer = L.maptilerLayer({
            style: tiles_url,
            language: 'ga',
            maptilerLogo: false,
          }).addTo(map);

Notice:

  • The style property of the maptilerLayer uses a URL to a JSON file that includes the mbtiles/pdf and styles from the remote tileserver
  • The maptiler logo is dislayed even when set to false because Map Tiler 1
  • In the page source Leaflet CSS and JS is included as normal
  • In the page source Extra JS and CSS for MapTiler SDK
  • The language property can be changed to 'en' to display names of towns and streets in English rather than Irish
  • Before this will work on a new domain, the tileserver needs to be configured to accept requests from the domain

1 MapTiler are a commercial company solely focused on making as much money as possible from the map community. My next task will be to try only freely-licensed alternatives.