It's easy and you don't need to setup anything. Default tiles are openstreetmap.
<iframe src="proxy.php?url=https%3A%2F%2Fembed.depackt.be%2F%3Flongitude%3D50%26amp%3Blatitude%3D4%26amp%3BdistanceKm%3D100" width="300" height="380" frameborder="0" allowtransparency="true"></iframe>
If you want custom titles, popup template and icons. You can use depackt-leaflet module and depackt api to populate the map with locations.
$ npm install https://github.com/depackt/depackt-leaflet --saveconst Minimap = require('depackt-leaflet')
const minimap = Minimap()
const mapComponent = minimap.render({
coords: {lng: 50, lat: 4},
zoom: 13,
items: [...],
tiles: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
mapbox: {},
tilesAttribution: '© <a href="proxy.php?url=http%3A%2F%2Fosm.org%2Fcopyright">OpenStreetMap</a> contributors',
icons: [
{
name: 'default',
template: `
<div>custom icon</div>
`
},
{
name: 'featured',
template: `
<div>custom icon</div>
`
}
]
})
document.body.appendChild(mapComponent)- Augustin Godiscal [email protected]