First commit
This commit is contained in:
commit
488631e1aa
|
|
@ -0,0 +1,222 @@
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"lat": 57.7146,
|
||||||
|
"lng": 12.0561
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 61.8917,
|
||||||
|
"lng": 18.5333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 58.3878,
|
||||||
|
"lng": 15.5679
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.3245,
|
||||||
|
"lng": 17.9421
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 60.3832,
|
||||||
|
"lng": 14.9444
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 63.1426,
|
||||||
|
"lng": 20.2333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 56.9747,
|
||||||
|
"lng": 13.1167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 62.1333,
|
||||||
|
"lng": 18.4167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.6333,
|
||||||
|
"lng": 16.9667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 64.0333,
|
||||||
|
"lng": 21.4333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 55.6833,
|
||||||
|
"lng": 12.5667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 61.5167,
|
||||||
|
"lng": 15.65
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 58.7167,
|
||||||
|
"lng": 16.5333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 60.6333,
|
||||||
|
"lng": 14.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 62.7833,
|
||||||
|
"lng": 18.4833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 57.5167,
|
||||||
|
"lng": 13.1167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 63.3833,
|
||||||
|
"lng": 19.9167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.1833,
|
||||||
|
"lng": 16.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 64.5667,
|
||||||
|
"lng": 21.5167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 56.2167,
|
||||||
|
"lng": 12.2333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 61.7833,
|
||||||
|
"lng": 15.4833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 58.3667,
|
||||||
|
"lng": 16.9833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 60.2833,
|
||||||
|
"lng": 14.3167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 62.6333,
|
||||||
|
"lng": 18.4833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 57.7833,
|
||||||
|
"lng": 13.4667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 63.5333,
|
||||||
|
"lng": 19.6167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.3667,
|
||||||
|
"lng": 16.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 64.9833,
|
||||||
|
"lng": 21.7667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 55.5833,
|
||||||
|
"lng": 12.1167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 61.1333,
|
||||||
|
"lng": 15.4333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 58.1833,
|
||||||
|
"lng": 16.5167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 60.2833,
|
||||||
|
"lng": 14.4667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 62.5333,
|
||||||
|
"lng": 18.4833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 57.3833,
|
||||||
|
"lng": 13.2667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 63.6167,
|
||||||
|
"lng": 19.7667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.5333,
|
||||||
|
"lng": 16.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 64.7833,
|
||||||
|
"lng": 21.9333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 55.3667,
|
||||||
|
"lng": 12.2333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 61.4667,
|
||||||
|
"lng": 15.5167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 58.2833,
|
||||||
|
"lng": 16.4833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 60.3667,
|
||||||
|
"lng": 14.3833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 62.7833,
|
||||||
|
"lng": 18.5167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 57.6167,
|
||||||
|
"lng": 13.2667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 63.7667,
|
||||||
|
"lng": 19.9167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.6833,
|
||||||
|
"lng": 16.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 64.9833,
|
||||||
|
"lng": 21.9667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 55.5167,
|
||||||
|
"lng": 12.2167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 61.5833,
|
||||||
|
"lng": 15.6333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 58.3667,
|
||||||
|
"lng": 16.4833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 60.4667,
|
||||||
|
"lng": 14.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 62.9667,
|
||||||
|
"lng": 18.5167
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 57.7667,
|
||||||
|
"lng": 13.3333
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 63.8833,
|
||||||
|
"lng": 19.9667
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 59.7833,
|
||||||
|
"lng": 16.2833
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"lat": 64.9833,
|
||||||
|
"lng": 21.9999
|
||||||
|
}
|
||||||
|
]
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,24 @@
|
||||||
|
#map {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-left: auto; margin-right: auto;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar {
|
||||||
|
position: absolute;
|
||||||
|
width:10%;
|
||||||
|
height:10%;
|
||||||
|
visibility: collapse;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="">
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.3.0/dist/MarkerCluster.css" >
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.3.0/dist/MarkerCluster.Default.css" >
|
||||||
|
<link rel="stylesheet" href="./extra/style.css">
|
||||||
|
<script src="./extra/libs/jquery.min.js"></script>
|
||||||
|
<script src="./extra/libs/leaflet.js.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
||||||
|
<script src="https://unpkg.com/leaflet.markercluster@1.3.0/dist/leaflet.markercluster.js"></script>
|
||||||
|
<html lang="en">
|
||||||
|
<head><title>Carls POI Survival Map</title></head>
|
||||||
|
<body>
|
||||||
|
<div id="map"></div>
|
||||||
|
<script src="./map.js"></script>
|
||||||
|
<div id="sidebar"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,70 @@
|
||||||
|
|
||||||
|
|
||||||
|
var shOSM = L.tileLayer('https://mbtiler.nyaaa.net/styles/basic-preview/512/{z}/{x}/{y}.png', {
|
||||||
|
maxZoom: 19,
|
||||||
|
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||||
|
});
|
||||||
|
|
||||||
|
var osmHOT = L.tileLayer('https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png', {
|
||||||
|
maxZoom: 19,
|
||||||
|
attribution: '© OpenStreetMap contributors, Tiles style by Humanitarian OpenStreetMap Team hosted by OpenStreetMap France'});
|
||||||
|
|
||||||
|
var map = L.map('map', {
|
||||||
|
layers: [shOSM,osmHOT],
|
||||||
|
zoom: 10,
|
||||||
|
center: [59.170448010556015, 18.17052930229775]
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
var baseMaps = {
|
||||||
|
"OpenStreetMap": osmHOT,
|
||||||
|
"OpenStreetMap Selfhosted": shOSM
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//var home = L.marker([59.171400616127954, 18.170324708303983]).addTo(map);
|
||||||
|
var popup = L.popup();
|
||||||
|
function onMapClick(e) {
|
||||||
|
popup
|
||||||
|
.setLatLng(e.latlng)
|
||||||
|
.setContent('<p>You clicked on the Map at: <br />' + e.latlng.toString() + ' </p>' )
|
||||||
|
.openOn(map);
|
||||||
|
}
|
||||||
|
|
||||||
|
map.on('click', onMapClick);
|
||||||
|
|
||||||
|
var markers = L.markerClusterGroup();
|
||||||
|
|
||||||
|
|
||||||
|
fetch('./data.json')
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
// Define waypoint markers
|
||||||
|
function createMarker(waypoint) {
|
||||||
|
return L.marker([waypoint.lat, waypoint.lng], {
|
||||||
|
radius: 5,
|
||||||
|
color: '#337aff',
|
||||||
|
fillColor: '#337aff'
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Create waypoints from server data and add them to the map
|
||||||
|
//var markers = [];
|
||||||
|
for (var i=0; i<data.length; i++) {
|
||||||
|
var marker = createMarker(data[i]);
|
||||||
|
//marker.addTo(map); // Add the marker to the existing map object
|
||||||
|
markers.addLayer(marker);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => console.error('Error:', error));
|
||||||
|
|
||||||
|
map.addLayer(markers);
|
||||||
|
var overlayMaps = {
|
||||||
|
"Shelters": markers
|
||||||
|
}
|
||||||
|
|
||||||
|
var layerControl = L.control.layers(baseMaps, overlayMaps).addTo(map);
|
||||||
Loading…
Reference in New Issue