Connection to database failed: Possibly the server was restarted. It takes about 10 minutes to read the database. Please try again later!
Verbindung zur Datenbank fehlgeschlagen: Eventuell wurde der Server neu gestartet.
Das Einlesen der Datenbank dauert etwa 10 Minuten. Bitte versuchen Sie es später noch einmal!
let url = location.protocol + "//" + location.host + "/img/";
let map = L.map('map', {
center: [53.47428035744,10.194711685181],
zoom: 15,
zoomControl: false,
tap: false
});
//Layers - OSM is pre selected
//variable for OSM
let OpenStreetMap_DE = L.tileLayer('https://{s}.tile.openstreetmap.de/tiles/osmde/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© OpenStreetMap contributors'
}).addTo(map);
//Variables for Bing
let BING_KEY = 'AlqnXp9wAwXT2E5_GRJanH9Xrx-olcRR7s8LBnkbiOkD6w-2Z4Cw4l3zuLZFN35M'
//Bing aerial
let bingLayerAerial = L.tileLayer.bing(BING_KEY)
//Bing road
let bingLayerRoad = L.tileLayer.bing({
bingMapsKey: BING_KEY,
imagerySet: 'RoadOnDemand',
culture: 'de_DE'
})
//openRailway
let OpenRailwayMap = L.tileLayer('https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: 'Map data: © OpenStreetMap contributors | Map style: © OpenRailwayMap (CC-BY-SA)'
})
//draw circle
let circle = L.circle([53.47428035744,10.194711685181], {
radius: 1000,
color: '#18BC9C',
fillOpacity: 0.05
});
circle.addTo(map);
//city boarders = Polygon
//Marker Icons
let LeafIcon = L.Icon.extend({
options: {
iconSize: [32, 37],
}
}
)
let cityMarker = new LeafIcon (
{
iconUrl: url + "stadt-icon.png"
}
)
let stopMarker = new LeafIcon (
{
iconUrl: url + "2726.png"
}
)
let stationMarker = new LeafIcon (
{
iconUrl: url + "2725.png"
}
)
let restaurantMarker = new LeafIcon (
{
iconUrl: url + ".png"
}
)
let myPositionMarker = new LeafIcon (
{
iconUrl: url + "myPosition.png"
}
)
//Center Icon
let centerMarker = L.marker([53.47428035744,10.194711685181], {icon: myPositionMarker})
centerMarker.bindPopup('Mein Standort
53.47428035744,10.194711685181').addTo(map);
function popUp(f,l){
let out = [];
if (f.properties){
for(key in f.properties){
if (key === 'name') {
f.properties[key] = ''+ f.properties[key] + '
';
}
out.push(f.properties[key]);
}
l.bindPopup(out.join("
"));
}
}
let hs = new L.geoJSON({"type": "FeatureCollection", "features": [{type: "Feature", "properties": {"name": "Kurf\u00fcrstendeich", "street": "Curslacker Deich 383", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.201663970947,53.466438083006]}},{type: "Feature", "properties": {"name": "Schleusendamm", "street": "Schleusendamm 11B", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.189819335938,53.467868703661]}},{type: "Feature", "properties": {"name": "Krapphofschleuse", "street": "Schleusendamm 11A", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.187759399414,53.469043820271]}},{type: "Feature", "properties": {"name": "Siedlung Curslack (Nord)", "street": "Curslacker Neuer Deich 78", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.205097198486,53.474203729847]}},{type: "Feature", "properties": {"name": "In der H\u00f6rn", "street": "In der H\u00f6rn 2", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.194711685181,53.47428035744]}},{type: "Feature", "properties": {"name": "BAB-Auffahrt Bergedorf", "street": "Curslacker Neuer Deich 72", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.20604133606,53.476196002291]}},{type: "Feature", "properties": {"name": "Nettelnburger Stra\u00dfe", "street": "Kampweg 4", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.196127891541,53.476272626287]}},{type: "Feature", "properties": {"name": "Katendeich", "street": "Nettelnburger Stra\u00dfe 32", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.191836357117,53.476936695117]}},{type: "Feature", "properties": {"name": "Klaus-Schaumann-Stra\u00dfe", "street": "Klaus-Schaumann-Stra\u00dfe 8", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.189261436462,53.47706439947]}},{type: "Feature", "properties": {"name": "Nettelnburger Stra\u00dfe (Mitte)", "street": "Nettelnburger Stra\u00dfe 77", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.185956954956,53.477600753555]}},{type: "Feature", "properties": {"name": "P\u00fcttenhorst (S\u00fcd)", "street": "P\u00fcttenhorst 1", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.186128616333,53.477983859465]}},{type: "Feature", "properties": {"name": "Nettelnburger Stra\u00dfe 70", "street": "Nettelnburger Stra\u00dfe 89", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.183167457581,53.478034939992]}},{type: "Feature", "properties": {"name": "Fiddigshagen", "street": "Randersweide 2", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.1975440979,53.47949070915]}},{type: "Feature", "properties": {"name": "Heulandhagen", "street": "Heulandhagen 7", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.189089775085,53.480282422285]}},{type: "Feature", "properties": {"name": "Wiesnerring", "street": "Wiesnerring 45", "URL": "Show details<\/a>"}, "geometry": {"type":"Point","coordinates":[10.199947357178,53.482708547949]}},]}, {
pointToLayer: function(point, latlng) {
return L.marker(latlng, {icon: stopMarker});
},
onEachFeature: popUp
});
let hsCluster = L.markerClusterGroup();
hs.addTo(hsCluster);
hsCluster.addTo(map);
let station =L.geoJSON({"type": "FeatureCollection", "features": []}, {
pointToLayer: function(point, latlng) {
return L.marker(latlng, {icon: stationMarker});
},
onEachFeature: popUp
});
let stationCluster = L.markerClusterGroup();
station.addTo(stationCluster);
stationCluster.addTo(map);
//variable for control.layer
let basemaps = {
"OpenStreetMap": OpenStreetMap_DE,
"Bing Strasse": bingLayerRoad,
"Bing Luftbild": bingLayerAerial,
"Bahnstrecken": OpenRailwayMap
};
let overlays = {
"My Position": centerMarker,
"Stops": hsCluster,
"Station": stationCluster,
}
//control for zoom
L.control.zoom({
zoomInTitle: 'hineinzoomen',
zoomOutTitle: 'herauszoomen',
zoomInText: '',
zoomOutText: '',
}).addTo(map);
//Layer control
L.control.layers(basemaps,overlays).addTo(map);