markus/lifo-dijkstraserv
1
0
Fork 0
Code Issues 3 Pull Requests Releases Wiki Activity

backend: Add support for streets

Browse Source
This commit is contained in:
Markus Koch 2020-04-17 16:43:34 +02:00
parent 7b65ef6ee4
commit e0970aacb9
1 changed files with 51 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
htdocs/mapscript.js
View File

@ -1,3 +1,19 @@
var streetLabelsRenderer = new L.StreetLabels({
collisionFlg: true,
propertyName: 'name',
showLabelIf: function (layer) {
return layer.geometry.type == "LineString";
},
fontStyle: {
dynamicFontSize: false,
fontSize: 10,
fontSizeUnit: "px",
lineWidth: 4.0,
fillStyle: "black",
strokeStyle: "white",
},
});
// Projection fix from: https://gis.stackexchange.com/questions/200865/leaflet-crs-simple-custom-scale // Projection fix from: https://gis.stackexchange.com/questions/200865/leaflet-crs-simple-custom-scale
var factorx = 1 / 256 * 4; var factorx = 1 / 256 * 4;
var factory = factorx; var factory = factorx;
@ -28,6 +44,7 @@ L.CRS.pr = L.extend({}, L.CRS.Simple, {
// Init map // Init map
var mymap = L.map('mapid', { var mymap = L.map('mapid', {
renderer: streetLabelsRenderer,
crs: L.CRS.pr crs: L.CRS.pr
}).setView([0, 0], 6); }).setView([0, 0], 6);
@ -82,34 +99,45 @@ function load_tiles(name, id) {
return satellite; return satellite;
} }
function load_geojson(name, url, iconname, iconcolor, active=1) { function load_geojson(name, url, iconname, iconcolor, active=1, style={}) {
var xhttp_ps = new XMLHttpRequest(); var xhttp_ps = new XMLHttpRequest();
xhttp_ps.onreadystatechange = function() { xhttp_ps.onreadystatechange = function() {
if (this.readyState == 4) { if (this.readyState == 4) {
if (this.status == 200) { if (this.status == 200) {
switch (iconname) {
case "street":
onEachFeature = null;
pointToLayer = null;
break;
default: /* else it is a marker with the specified icon */
onEachFeature = function(feature, layer) {
label = String(feature.properties.name)
layer.bindPopup('<h1><a href="https://wiki.linux-forks.de/mediawiki/index.php/' + feature.properties.name + '">' + feature.properties.name + '</a> (' + feature.geometry.coordinates + ')</h1>' + '<p><img style="width:100%" src="' + feature.properties.image + '"></p>' + '<p>' + feature.properties.description + '</p>');
layer.bindTooltip(label, {
permanent: true,
direction: "center",
className: "city-names"
}).openTooltip();
};
pointToLayer = function(feature, latlng) {
label = String(feature.properties.name)
return new L.marker(latlng,{
icon: L.AwesomeMarkers.icon({
icon: iconname,
markerColor: iconcolor
})
}).bindTooltip(label, {
permanent: false,
direction: "center",
opacity: 0.7
}).openTooltip();
};
break;
}
var geojson = L.geoJSON(JSON.parse(xhttp_ps.responseText), { var geojson = L.geoJSON(JSON.parse(xhttp_ps.responseText), {
onEachFeature: function(feature, layer) { style: style,
label = String(feature.properties.name) onEachFeature: onEachFeature,
layer.bindPopup('<h1><a href="https://wiki.linux-forks.de/mediawiki/index.php/' + feature.properties.name + '">' + feature.properties.name + '</a> (' + feature.geometry.coordinates + ')</h1>' + '<p><img style="width:100%" src="' + feature.properties.image + '"></p>' + '<p>' + feature.properties.description + '</p>'); pointToLayer: pointToLayer
layer.bindTooltip(label, {
permanent: true,
direction: "center",
className: "city-names"
}).openTooltip();
},
pointToLayer: function(feature, latlng) {
label = String(feature.properties.name)
return new L.marker(latlng,{
icon: L.AwesomeMarkers.icon({
icon: iconname,
markerColor: iconcolor
})
}).bindTooltip(label, {
permanent: false,
direction: "center",
opacity: 0.7
}).openTooltip();
}
}); });
layers.addOverlay(geojson, name); layers.addOverlay(geojson, name);
if (active) if (active)