function initMap() { if ($('#map').length) { let map_provider = $('#map-provider').val(); let lat = $('#map-lat').val(); let lng = $('#map-lng').val(); let zoom = parseInt($('#map-zoom').val()); let address = $('#map-dir').val(); let api_key = $('#map-api-key').val(); let map = new L.map('map').setView([lat, lng], zoom); if (map_provider === 'mapbox' && api_key.length) { L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', { attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>', tileSize: 512, maxZoom: 18, zoomOffset: -1, id: 'mapbox/streets-v11', accessToken: api_key, }).addTo(map); } else { L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 19, attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>', }).addTo(map); } let marker = L.marker([lat, lng]).addTo(map); let url = lat + ',' + lng + '#map=' + zoom + '/' + lat + '/' + lng + '&layers=N'; marker.bindPopup( address + '<p><a href="https://www.openstreetmap.org/directions?engine=osrm_car&route=' + url + '">Routing via OpenStreetMap</a></p>', ); } } document.addEventListener('DOMContentLoaded', function () { // Initialise street maps if necessary. initMap(); });