antonia/streckenkarte
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add configurable brouter profiles per layer

Browse source
This commit is contained in:
Antonia 2025-05-01 22:04:17 +02:00
parent 6041378e44
commit d8703eb61c
1 changed files with 17 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

26
frontend/common/map.js
View file

@ -90,7 +90,10 @@ fetch("layers.json")
document.title = data["name"] document.title = data["name"]
const layers = data["layers"] const layers = data["layers"]
for (let key in layers) { for (let key in layers) {
l.push({ dirname: key , name: layers[key]["humanname"], color: layers[key]["color"] }); let layer = layers[key]
layer.name = layer['humanname']
layer.dirname = key
l.push(layer)
rules.push({ rules.push({
dataLayer: key, dataLayer: key,
symbolizer: new protomapsL.LineSymbolizer(layers[key]) symbolizer: new protomapsL.LineSymbolizer(layers[key])
@ -168,7 +171,6 @@ async function recompute_anglemarkers(g) {
for (j=0; j< g.length; j++) { for (j=0; j< g.length; j++) {
const coords = g[j].geometry.coordinates; const coords = g[j].geometry.coordinates;
console.log(coords);
for (let i=1; i < coords.length - 1; i++) { for (let i=1; i < coords.length - 1; i++) {
const a = computeVector(coords,i); const a = computeVector(coords,i);
const b = computeVector(coords,i+1); const b = computeVector(coords,i+1);
@ -179,7 +181,6 @@ async function recompute_anglemarkers(g) {
mark.addTo(map); mark.addTo(map);
mark._icon.classList.add("warn"); mark._icon.classList.add("warn");
} }
console.log(angle)
} }
} }
} }
@ -204,7 +205,8 @@ async function updateBrouter () {
for (let i = 0; i < markers.length - 1 ; i++) { for (let i = 0; i < markers.length - 1 ; i++) {
const marker1 = markers[i].getLatLng(); const marker1 = markers[i].getLatLng();
const marker2 = markers[i+1].getLatLng(); const marker2 = markers[i+1].getLatLng();
const url = `https://brouter.de/brouter?lonlats=${marker1.lng},${marker1.lat}|${marker2.lng},${marker2.lat}&profile=rail&alternativeidx=0&format=geojson`; const profile = document.querySelector("#brouter-profile").value;
const url = `https://brouter.de/brouter?lonlats=${marker1.lng},${marker1.lat}|${marker2.lng},${marker2.lat}&profile=${profile}&alternativeidx=0&format=geojson`;
fetch(url).then((response) => { fetch(url).then((response) => {
if (!response.ok) { if (!response.ok) {
throw new Error("HTTP error " + response.status); throw new Error("HTTP error " + response.status);
@ -216,8 +218,6 @@ async function updateBrouter () {
map.removeLayer(geojson); map.removeLayer(geojson);
} }
delete data.features[0].properties.messages; delete data.features[0].properties.messages;
console.log(data.features[0].geometry.coordinates)
geojsons.push(data.features[0]); geojsons.push(data.features[0]);
recompute_anglemarkers(geojsons); recompute_anglemarkers(geojsons);
const dat = {type: "FeatureCollection", features: geojsons}; const dat = {type: "FeatureCollection", features: geojsons};
@ -251,6 +251,13 @@ map.on('click', function(e) {
async function quitEdit(e) { async function quitEdit(e) {
for (i=0; i< markers.length; i++) {
map.removeLayer(markers[i]);
}
markers = []
updateBrouter()
recompute_anglemarkers([]);
e.stopPropagation() e.stopPropagation()
L.DomEvent.preventDefault(e); L.DomEvent.preventDefault(e);
editMode = false; editMode = false;
@ -269,11 +276,10 @@ async function pickDirectory(e){
const layerspan = document.querySelector("#layername") const layerspan = document.querySelector("#layername")
layerspan.innerHTML = "" layerspan.innerHTML = ""
for (i = 0; i < l.length ; i++ ) { for (i = 0; i < l.length ; i++ ) {
console.log(l[i].dirname);
if (l[i].dirname === dirHandle.name) { if (l[i].dirname === dirHandle.name) {
console.log(l[i])
console.log(this)
editlayer = l[i]; editlayer = l[i];
const profile = editlayer["brouter-profile"] ?? "rail" ;
document.querySelector("#brouter-profile").value = profile;
layerspan.innerHTML = "Editing layer " + layer_legend(l[i]) + "<br>" layerspan.innerHTML = "Editing layer " + layer_legend(l[i]) + "<br>"
break; break;
} }
@ -326,6 +332,8 @@ if (edit) {
buttonDiv.innerHTML = `<button id="edit-mode" onClick="pickDirectory(event)" >Edit</button> buttonDiv.innerHTML = `<button id="edit-mode" onClick="pickDirectory(event)" >Edit</button>
<div class="edit-ui"> <div class="edit-ui">
<div id="layername" ></div> <div id="layername" ></div>
<label for="brouter-profile">Brouter Profile</label><br>
<input type="text" id="brouter-profile" ><br>
<label for="angle">Turn restriction sensitivity</label><br> <label for="angle">Turn restriction sensitivity</label><br>
<input type="range" min="0" step="0.05" max="1" value="0.35" class="slider" id="angle" onchange="recompute_anglemarkers(geojsons)" ><br> <input type="range" min="0" step="0.05" max="1" value="0.35" class="slider" id="angle" onchange="recompute_anglemarkers(geojsons)" ><br>
<button id="save" onClick="pickDirectory(event)" >Save</button><button id="quit" onclick="quitEdit(event)" >Quit</button> <button id="save" onClick="pickDirectory(event)" >Save</button><button id="quit" onclick="quitEdit(event)" >Quit</button>