←Examples

Themes with custom tileLayer @0.0.7^

Leaflet custom tileLayer for different themes check out this collection.

<script>
  import Map from "@anoram/leaflet-svelte";
  let options = {
    center: [13, 80],
    markers: [
      {
        lat: 13,
        lng: 80,
      },
    ],
    mapID: "map",
    tilelayers: [
      {
        url: "https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png",
        attribution: `&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Tiles style by <a href="https://www.hotosm.org/" target="_blank">Humanitarian OpenStreetMap Team</a> hosted by <a href="https://openstreetmap.fr/" target="_blank">OpenStreetMap France</a>`,
      }
    ],
  };
  
</script>

<style>
  .map {
    height: 600px;
    width: auto;
  }

</style>


<div class="map">
  <Map {options} />
</div>

Note

Some services require API keys.