don/pilgrim
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Simple routing with GH

Browse Source
This commit is contained in:
don philipe
2024-08-04 20:26:32 +02:00
parent 0e378867c1
commit 54fd1e4704
8 changed files with 188 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -1 +1,2 @@
target/ target/
pilgrim.properties

5
pom.xml
View File

@@ -31,6 +31,11 @@
<artifactId>apache-jsp</artifactId> <artifactId>apache-jsp</artifactId>
<version>11.0.3</version> <version>11.0.3</version>
</dependency> </dependency>
<dependency>
<groupId>org.json</groupId>
<artifactId>json</artifactId>
<version>20240303</version>
</dependency>
</dependencies> </dependencies>
<build> <build>

43
src/main/java/de/spacedon/ConfigServlet.java Normal file
View File

@@ -0,0 +1,43 @@
package de.spacedon;
import java.io.InputStream;
import java.io.IOException;
import java.util.Properties;
import jakarta.servlet.ServletException;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import org.json.JSONObject;
public class ConfigServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json");
response.setStatus(HttpServletResponse.SC_OK);
Properties conf = getConfig("de/spacedon/pilgrim.properties");
JSONObject jo = new JSONObject();
jo.put("ghbase", conf.getProperty("ghbase"));
response.getWriter().println(jo);
}
/**
* Try to load properties file from given path and return it.
* IOExceptions will be caught (e.g. when the file doesn't exist).
* @param path Path to properties file
* @return properties from given path
*/
protected static Properties getConfig(String path) {
Properties config = new Properties();
ClassLoader loader = Thread.currentThread().getContextClassLoader();
try (InputStream resourceStream = loader.getResourceAsStream(path)) {
config.load(resourceStream);
} catch (IOException ex) {
ex.printStackTrace();
}
return config;
}
}

18
src/main/java/de/spacedon/MyServlet.java
View File

@@ -1,18 +0,0 @@
package de.spacedon;
import java.io.IOException;
import jakarta.servlet.ServletException;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
public class MyServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json");
response.setStatus(HttpServletResponse.SC_OK);
response.getWriter().println("{\"status\":\"ok\"}");
}
}

4
src/main/java/de/spacedon/PilgrimServer.java
View File

@@ -20,8 +20,8 @@ public class PilgrimServer {
contextHandler.setContextPath("/"); contextHandler.setContextPath("/");
server.setHandler(contextHandler); server.setHandler(contextHandler);
// register custom Servlet at endpoint /index // register custom Servlet at endpoint /config
contextHandler.addServlet(new ServletHolder(new MyServlet()), "/index"); contextHandler.addServlet(new ServletHolder(new ConfigServlet()), "/config");
// register index.html // register index.html
ServletHolder staticHolder = new ServletHolder(new DefaultServlet()); ServletHolder staticHolder = new ServletHolder(new DefaultServlet());

1
src/main/resources/de/spacedon/pilgrim-example.properties Normal file
View File

@@ -0,0 +1 @@
ghbase=http://

49
src/main/webapp/index.html
View File

@@ -2,8 +2,9 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Display a map</title> <title>Pilgrim</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<script src="jquery-3.7.1.min.js"></script>
<script src="lib.js"></script> <script src="lib.js"></script>
<script src="https://unpkg.com/maplibre-gl@3.1.0/dist/maplibre-gl.js"></script> <script src="https://unpkg.com/maplibre-gl@3.1.0/dist/maplibre-gl.js"></script>
<link href="https://unpkg.com/maplibre-gl@3.1.0/dist/maplibre-gl.css" rel="stylesheet"> <link href="https://unpkg.com/maplibre-gl@3.1.0/dist/maplibre-gl.css" rel="stylesheet">
@@ -34,52 +35,10 @@
</style> </style>
</head> </head>
<body> <body>
<div id="map"> <div id="map"></div>
</div>
<pre id="features"></pre> <pre id="features"></pre>
<script> <script>
var map = new maplibregl.Map({ container: 'map', // container id lib.init();
//style: 'https://demotiles.maplibre.org/style.json', // style URL
style: 'spacedon.json', // style URL
center: [13, 51], // starting position [lng, lat]
zoom: 6 // starting zoom
});
map.addControl(new maplibregl.NavigationControl());
map.on('mousemove', function (e) {
var features = map.queryRenderedFeatures(e.point);
// Limit the number of properties we're displaying for
// legibility and performance
var displayProperties = [ 'type', 'properties', 'id', 'layer', 'source', 'sourceLayer', 'state' ];
var displayFeatures = features.map(function (feat) {
var displayFeat = {};
displayProperties.forEach(function (prop) {
displayFeat[prop] = feat[prop];
});
return displayFeat;
});
document.getElementById('features').innerHTML = JSON.stringify( displayFeatures, null, 2 );
});
map.on('click', function (e) {
var coordinates = e.lngLat;
// Ensure that if the map is zoomed out such that multiple
// copies of the feature are visible, the popup appears
// over the copy being pointed to.
while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {
coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;
}
new maplibregl.Popup()
.setLngLat(coordinates)
.setHTML('<button>start</button></br><button>via</button></br><button>finish</button>')
.addTo(map);
});
const startMarker = new maplibregl.Marker({draggable: true})
.setLngLat([0, 0]);
const finishMarker = new maplibregl.Marker({draggable: true})
.setLngLat([0, 0]);
const viaMarkers = new Array();
</script> </script>
</body> </body>
</html> </html>

125
src/main/webapp/lib.js
View File

@@ -1,7 +1,124 @@
let lib = new function () { const lib = new function () {
this.setStartMarker = function (coordinates) {
let ghbase = ""
/**
* Initialize Map etc
*/
this.init = function () {
$.get("/config", function(result) { ghbase = result["ghbase"]; });
const map = new maplibregl.Map({ container: 'map',
style: 'spacedon.json',
center: [13, 51],
zoom: 6
});
map.addControl(new maplibregl.NavigationControl());
const startMarker = new maplibregl.Marker({color: "#00FF00", draggable: true}).setLngLat([0, 0]);
const finishMarker = new maplibregl.Marker({color: "#FF0000", draggable: true}).setLngLat([0, 0]);
startMarker.on("dragend", function() {lib.doRouting(map, startMarker.getLngLat(), finishMarker.getLngLat());});
finishMarker.on("dragend", function() {lib.doRouting(map, startMarker.getLngLat(), finishMarker.getLngLat());});
const viaMarkers = new Array();
map.on('mousemove', function (e) {
var features = map.queryRenderedFeatures(e.point);
// Limit the number of properties we're displaying for
// legibility and performance
var displayProperties = [ 'type', 'properties', 'id', 'layer', 'source', 'sourceLayer', 'state' ];
var displayFeatures = features.map(function (feat) {
var displayFeat = {};
displayProperties.forEach(function (prop) {
displayFeat[prop] = feat[prop];
});
return displayFeat;
});
document.getElementById('features').innerHTML = JSON.stringify( displayFeatures, null, 2 );
});
map.on('click', function (e) {
let coordinates = e.lngLat;
// Ensure that if the map is zoomed out such that multiple
// copies of the feature are visible, the popup appears
// over the copy being pointed to.
while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {
coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;
} }
this.setMarker = function (marker, lng, lat, map) {
marker.setLngLat([lng, lat]).addTo(map); const contextmenu = new maplibregl.Popup()
.setLngLat(coordinates)
.setHTML('<button id="btn-start">start</button></br><button id="btn-via">via</button></br><button id="btn-finish">finish</button>')
.addTo(map);
let startbtn = document.getElementById("btn-start");
startbtn.onclick = function () {
contextmenu.remove();
startMarker.setLngLat([coordinates.lng, coordinates.lat]).addTo(map);
startMarker.onMap = true;
if (finishMarker.onMap) {
lib.doRouting(map, coordinates, finishMarker.getLngLat());
}
};
let finishbtn = document.getElementById("btn-finish");
finishbtn.onclick = function () {
contextmenu.remove();
finishMarker.setLngLat([coordinates.lng, coordinates.lat]).addTo(map);
finishMarker.onMap = true;
if (startMarker.onMap) {
lib.doRouting(map, startMarker.getLngLat(), coordinates);
}
};
});
};
this.doRouting = function (map, start, finish, vias = undefined, vehicle = "foot") {
const s = [start.lat, start.lng];
let data = {
points: [
[start.lng, start.lat]
],
profile: vehicle,
points_encoded: false
};
if (vias != undefined && vias.length > 0) {
}
data.points.push([finish.lng, finish.lat])
$.ajax({
type: "POST",
url: ghbase + "/route",
data: JSON.stringify(data),
contentType: "application/json",
success: function (result) {
if(map.getLayer("route") !== undefined) {
map.removeLayer("route");
}
if(map.getSource("ghroute") !== undefined) {
map.removeSource("ghroute");
}
map.addSource("ghroute", {
"type": "geojson",
"data": {
"type": "Feature",
"geometry": result.paths[0].points
}
});
map.addLayer({
"id": "route",
"type": "line",
"source": "ghroute",
"layout": {
"line-join": "round",
"line-cap": "round"
},
"paint": {
"line-color": "#f00",
"line-width": 9
}
});
},
dataType: "json"
});
}; };
}; };