L.switchBasemap

An easy leaflet plugin to switch basemap

!image

Based and inspired on Leaflet-IconLayers

$3

-----------------------------------------------------------------------------------

Requirements

• Leaflet

Install

$3

``
npm i leaflet-switch-basemap
`

Usage Example

An easy way to implement control to switch between basemaps

`javascript
new L.basemapsSwitcher([
{
layer: L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap contributors'
}).addTo(map), //DEFAULT MAP
icon: './assets/images/img1.PNG',
name: 'Map one'
},
{
layer: L.tileLayer('https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}{r}.png',{
attribution: '© Stadia Maps, © OpenMapTiles © OpenStreetMap contributors'
}),
icon: './assets/images/img2.PNG',
name: 'Map two'
},
{
layer: L.tileLayer('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', {
attribution: 'Map data: © OpenStreetMap contributors, SRTM | Map style: © OpenTopoMap (CC-BY-SA)'
}),
icon: './assets/images/img3.PNG',
name: 'Map three'
},
], { position: 'topright' }).addTo(map);

``
L.switchBasemap receives two arguments:

• The first is an array of objects that contains basemap configs


• The second is an object with control options

$3

| Property | Type | Required | Description |
| ------------|--- | -------- | ----------------------------------------- |
| layer | Leaflet layer | true | A leaflet layer that can be used as basemap (example: L.tileLayer) |
| icon | String |true| Path of the Image that will be display on the control |
| name | String | true | Name of the layer |

$3

| Option | Type | Default | Description |
| ------------|--- | -------- | ----------------------------------------- |
| position |String | 'topright' | Position of the control. Options: leaflet control positions |