diff --git a/assets/images/map-shadow.png b/assets/images/map-shadow.png new file mode 100644 index 0000000..42fae9a --- /dev/null +++ b/assets/images/map-shadow.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:b1520182ff8fbf2272465fbb8b45060b845e62ab3e88b1f7d9c737af58df17df +size 11227 diff --git a/assets/images/map.png b/assets/images/map.png new file mode 100644 index 0000000..3d8a545 --- /dev/null +++ b/assets/images/map.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:7612ea9258679e959e81ab0b7bcab967eef6215d7ca491aeef0204de25b46df2 +size 58224 diff --git a/assets/js/openstreetmap.js b/assets/js/openstreetmap.js index 0ec0f5f..0341416 100644 --- a/assets/js/openstreetmap.js +++ b/assets/js/openstreetmap.js @@ -1,42 +1,88 @@ -var mymap = L.map("mapid").setView([47.7123, 9.3995], 19); + var mymap = L.map('mapid').setView([47, 9.2], 7); -L.tileLayer("https://tiles.ffbsee.de:9090/{z}/{x}/{y}.png", { - maxZoom: 19, - attribution: "Map data © OpenStreetMap contributors, " + - "CC-BY-SA, ", - id: "mapbox.streets" -}).addTo(mymap); +var greenIcon = L.icon({ + iconUrl: '/images/map.png', + shadowUrl: '/images/map-shadow.png', + + iconSize: [52, 60], // size of the icon + shadowSize: [60, 60], // size of the shadow + iconAnchor: [26, 62], // point of the icon which will correspond to marker's location + shadowAnchor: [2, 55], // the same for the shadow + popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor +}); + + + L.tileLayer('https://tiles.ffbsee.de:9090/{z}/{x}/{y}.png', { + maxZoom: 19, + attribution: 'Map data © OpenStreetMap contributors, ' + + 'CC-BY-SA ' + }).addTo(mymap); + + + L.marker([47.71234, 9.39956], {icon: greenIcon}).addTo(mymap) + .bindPopup("").openPopup(); + + L.marker([49.8781, 8.65401], {icon: greenIcon}).addTo(mymap) + .bindPopup("").openPopup(); + + L.marker([47.77243, 9.19943], {icon: greenIcon}).addTo(mymap) + .bindPopup("").openPopup(); -L.marker([47.71240915, 9.3995668]).addTo(mymap) -.bindPopup("").openPopup(); -L.polygon([ - [47.71242900, 9.39956546], - [47.71231350, 9.39980686], - [47.71222687, 9.39971030], - [47.71229545, 9.39956009], - [47.71223409, 9.39949036], - [47.71227740, 9.39939916]], { - color: "orange", - fillColor: "orange", - fillOpacity: 0.5 -}).addTo(mymap).bindPopup("Vereinsheim"); L.polygon([ - [47.71208610, 9.39969957], - [47.71217273, 9.39950109], - [47.71220882, 9.39953864], - [47.71212220, 9.39973176] -]).addTo(mymap).bindPopup("Hier Parken"); - -L.polygon([ - [47.71219800, 9.39945817], - [47.71224131, 9.39936161], - [47.71227379, 9.39939916], - [47.71223409, 9.39949036] -]).addTo(mymap).bindPopup("Hier Parken"); + [49.87814327607132, 8.653730368550693], + [49.8780226890993, 8.653828203678133], + [49.87818731851169, 8.654329776763918], + [49.878306512632534, 8.654230535030367]], + { + color: 'ForestGreen ', + fillColor: 'ForestGreen ', + fillOpacity: 0.5 + }).addTo(mymap).bindPopup(""); + L.circle([49.87807977529451, 8.65401059389114], 2, { + color: 'DarkGreen', + fillColor: 'DarkGreen', + fillOpacity: 0.5 + }).addTo(mymap).bindPopup("Eingang"); -L.circle([47.71229545, 9.39956009], 2, { - color: "red", - fillColor: "red", - fillOpacity: 0.5 -}).addTo(mymap).bindPopup("Eingang"); + + + +L.polygon([ + [47.77244138, 9.19947267], + [47.77241975, 9.19938147], + [47.77244499, 9.19931710], + [47.77252791, 9.19920444], + [47.77259641, 9.19923663], + [47.77260001, 9.19926345], + [47.77249907, 9.19939756]], + { + color: '#5eba5e', + fillColor: '#5eba5e', + fillOpacity: 0.5 + }).addTo(mymap).bindPopup(""); + L.circle([47.77243191425533, 9.199432432651522], 2, { + color: 'blue', + fillColor: 'blue', + fillOpacity: 0.5 + }).addTo(mymap).bindPopup("Eingang"); + + + + L.polygon([ + [47.71242900, 9.39956546], + [47.71231350, 9.39980686], + [47.71222687, 9.39971030], + [47.71229545, 9.39956009], + [47.71223409, 9.39949036], + [47.71227740, 9.39939916]], { + color: 'orange', + fillColor: 'orange', + fillOpacity: 0.5 + }).addTo(mymap).bindPopup(""); + + L.circle([47.71229545, 9.39956009], 2, { + color: 'red', + fillColor: 'red', + fillOpacity: 0.5 + }).addTo(mymap).bindPopup("Eingang"); diff --git a/templates/vereinsheim.html b/templates/vereinsheim.html index 8cf8a04..7768f75 100644 --- a/templates/vereinsheim.html +++ b/templates/vereinsheim.html @@ -42,8 +42,8 @@ $('.lightgallery').lightGallery(); }); - - - - + + + + {% endblock %}