123456789101112131415161718192021222324252627282930313233343536373839404142434445 |
- var map = L.map('map').setView([44.5000, 11.3447], 13);
- L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-background/{z}/{x}/{y}.{ext}', {
- attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — Map data © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
- subdomains: 'abcd',
- maxZoom: 15,
- minZoom: 12,
- ext: 'png'
- }).addTo(map);;
- var geojsonMarkerOptions = {
- radius: 8,
- fillColor: "#fb1f4f",
- color: "#000",
- weight: 1,
- opacity: 1,
- fillOpacity: 0.94
- };
- var request = new XMLHttpRequest();
- request.open('GET', './map.geojson', true);
- request.onload = function() {
- if (request.status >= 200 && request.status < 400) {
- L.geoJSON(JSON.parse(request.responseText), {
- pointToLayer: function (feature, latlng) {
- return L.circleMarker(latlng, geojsonMarkerOptions);
- },
- onEachFeature: (feature, layer) => {
- if (feature.properties && feature.properties.name) {
- layer.bindPopup("<h1>"+feature.properties.name+"</h1>"+feature.properties.description.replace("\n","<br><br>"));
- }
- }
- }).addTo(map);
- } else {
- console.log("error: "+request)
- }
- };
- request.onerror = function() {
- console.log("error: "+request)
- };
- request.send();
|