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