From 0bf889bea885b1edc0ce8e4adb296b3f0389ad14 Mon Sep 17 00:00:00 2001
From: Areeb <011235813phantom@gmail.com>
Date: Fri, 16 Jan 2026 22:47:01 +0530
Subject: [PATCH] Add demo links for routing engine directions
- Extend the routes variable to include the selected routing mode and routing engine
- Generate routing engine demo URLs using URLSearchParams with engine-specific parameters
- Add a demo link to the directions view so routes can be opened in external routing engine demos
---
.../index/directions-route-output.js | 3 ++
.../index/directions/fossgis_osrm.js | 27 ++++++++++++-----
.../index/directions/fossgis_valhalla.js | 25 +++++++++++-----
.../index/directions/graphhopper.js | 29 +++++++++++++------
app/views/directions/show.html.erb | 3 ++
config/locales/en.yml | 1 +
6 files changed, 63 insertions(+), 25 deletions(-)
diff --git a/app/assets/javascripts/index/directions-route-output.js b/app/assets/javascripts/index/directions-route-output.js
index cbad36f81..5bb9e9640 100644
--- a/app/assets/javascripts/index/directions-route-output.js
+++ b/app/assets/javascripts/index/directions-route-output.js
@@ -138,6 +138,9 @@ OSM.DirectionsRouteOutput = function (map) {
$("#directions_route_credit")
.text(route.credit)
.prop("href", route.creditlink);
+ $("#directions_route_demo")
+ .text(route.credit)
+ .prop("href", route.demolink);
};
routeOutput.fit = function () {
diff --git a/app/assets/javascripts/index/directions/fossgis_osrm.js b/app/assets/javascripts/index/directions/fossgis_osrm.js
index a97bc25a5..24304abcd 100644
--- a/app/assets/javascripts/index/directions/fossgis_osrm.js
+++ b/app/assets/javascripts/index/directions/fossgis_osrm.js
@@ -2,7 +2,7 @@
// Doesn't yet support hints
(function () {
- function FOSSGISOSRMEngine(modeId, vehicleType) {
+ function FOSSGISOSRMEngine(modeId, vehicleType, srv) {
let cachedHints = [];
function getInstructionText(step) {
@@ -150,9 +150,7 @@
line: steps.flatMap(step => step[3]),
steps,
distance: leg.distance,
- time: leg.duration,
- credit: "OSRM (FOSSGIS)",
- creditlink: "https://routing.openstreetmap.de/about.html"
+ time: leg.duration
};
}
@@ -175,20 +173,33 @@
cachedHints = [];
}
+ const demoQuery = new URLSearchParams({ srv: srv });
+
+ for (const { lat, lng } of points) {
+ demoQuery.append("loc", [lat, lng]);
+ }
+
+ const meta = {
+ credit: "OSRM (FOSSGIS)",
+ creditlink: "https://routing.openstreetmap.de/about.html",
+ demolink: "https://routing.openstreetmap.de/?" + demoQuery
+ };
const req_path = "routed-" + vehicleType + "/route/v1/driving/" + points.map(p => p.lng + "," + p.lat).join(";");
return fetch(OSM.FOSSGIS_OSRM_URL + req_path + "?" + query, { signal })
.then(response => response.json())
.then(response => {
if (response.code !== "Ok") throw new Error();
+
cachedHints = response.waypoints.map(wp => wp.hint);
- return _processDirections(response.routes[0].legs[0]);
+
+ return { ... _processDirections(response.routes[0].legs[0]), ...meta };
});
}
};
}
- OSM.Directions.addEngine(new FOSSGISOSRMEngine("car", "car"), true);
- OSM.Directions.addEngine(new FOSSGISOSRMEngine("bicycle", "bike"), true);
- OSM.Directions.addEngine(new FOSSGISOSRMEngine("foot", "foot"), true);
+ OSM.Directions.addEngine(new FOSSGISOSRMEngine("car", "car", "0"), true);
+ OSM.Directions.addEngine(new FOSSGISOSRMEngine("bicycle", "bike", "1"), true);
+ OSM.Directions.addEngine(new FOSSGISOSRMEngine("foot", "foot", "2"), true);
}());
diff --git a/app/assets/javascripts/index/directions/fossgis_valhalla.js b/app/assets/javascripts/index/directions/fossgis_valhalla.js
index 29f858146..1a52e8e17 100644
--- a/app/assets/javascripts/index/directions/fossgis_valhalla.js
+++ b/app/assets/javascripts/index/directions/fossgis_valhalla.js
@@ -1,5 +1,5 @@
(function () {
- function FOSSGISValhallaEngine(modeId, costing) {
+ function FOSSGISValhallaEngine(modeId, costing, profile) {
const INSTR_MAP = [
"straight", // kNone = 0;
"start", // kStart = 1;
@@ -56,9 +56,7 @@
line,
steps,
distance: leg.summary.length * 1000,
- time: leg.summary.time,
- credit: "Valhalla (FOSSGIS)",
- creditlink: "https://valhalla.openstreetmap.de/"
+ time: leg.summary.time
};
}
@@ -80,17 +78,28 @@
}
})
});
+ const demoQuery = new URLSearchParams({
+ profile: profile,
+ wps: points.flatMap(({ lat, lng }) => [lng, lat])
+ });
+ const meta = {
+ credit: "Valhalla (FOSSGIS)",
+ creditlink: "https://valhalla.openstreetmap.de/",
+ demolink: "https://valhalla.openstreetmap.de/directions?" + demoQuery
+ };
+
return fetch(OSM.FOSSGIS_VALHALLA_URL + "?" + query, { signal })
.then(response => response.json())
.then(({ trip }) => {
if (trip.status !== 0) throw new Error();
- return _processDirections(trip.legs[0]);
+
+ return { ..._processDirections(trip.legs[0]), ...meta };
});
}
};
}
- OSM.Directions.addEngine(new FOSSGISValhallaEngine("car", "auto"), true);
- OSM.Directions.addEngine(new FOSSGISValhallaEngine("bicycle", "bicycle"), true);
- OSM.Directions.addEngine(new FOSSGISValhallaEngine("foot", "pedestrian"), true);
+ OSM.Directions.addEngine(new FOSSGISValhallaEngine("car", "auto", "car"), true);
+ OSM.Directions.addEngine(new FOSSGISValhallaEngine("bicycle", "bicycle", "bicycle"), true);
+ OSM.Directions.addEngine(new FOSSGISValhallaEngine("foot", "pedestrian", "pedestrian"), true);
}());
diff --git a/app/assets/javascripts/index/directions/graphhopper.js b/app/assets/javascripts/index/directions/graphhopper.js
index 18c1225f9..9c0c8f615 100644
--- a/app/assets/javascripts/index/directions/graphhopper.js
+++ b/app/assets/javascripts/index/directions/graphhopper.js
@@ -1,5 +1,5 @@
(function () {
- function GraphHopperEngine(modeId, vehicleType) {
+ function GraphHopperEngine(modeId, vehicleType, profile) {
const GH_INSTR_MAP = {
"-3": "sharp-left",
"-2": "left",
@@ -35,9 +35,7 @@
distance: path.distance,
time: path.time / 1000,
ascend: path.ascend,
- descend: path.descend,
- credit: "GraphHopper",
- creditlink: "https://www.graphhopper.com/"
+ descend: path.descend
};
}
@@ -55,18 +53,31 @@
elevation: false,
instructions: true
});
- points.forEach(p => query.append("point", p.lat + "," + p.lng));
+ const demoQuery = new URLSearchParams({ profile });
+
+ for (const { lat, lng } of points) {
+ query.append("point", [lat, lng]);
+ demoQuery.append("point", [lat, lng]);
+ }
+
+ const meta = {
+ credit: "GraphHopper",
+ creditlink: "https://www.graphhopper.com/",
+ demolink: "https://graphhopper.com/maps/?" + demoQuery
+ };
+
return fetch(OSM.GRAPHHOPPER_URL + "?" + query, { signal })
.then(response => response.json())
.then(({ paths }) => {
if (!paths || paths.length === 0) throw new Error();
- return _processDirections(paths[0]);
+
+ return { ... _processDirections(paths[0]), ...meta };
});
}
};
}
- OSM.Directions.addEngine(new GraphHopperEngine("car", "car"), true);
- OSM.Directions.addEngine(new GraphHopperEngine("bicycle", "bike"), true);
- OSM.Directions.addEngine(new GraphHopperEngine("foot", "foot"), true);
+ OSM.Directions.addEngine(new GraphHopperEngine("car", "car", "car"), true);
+ OSM.Directions.addEngine(new GraphHopperEngine("bicycle", "bike", "bike"), true);
+ OSM.Directions.addEngine(new GraphHopperEngine("foot", "foot", "foot"), true);
}());
diff --git a/app/views/directions/show.html.erb b/app/views/directions/show.html.erb
index f5712012b..4096405e3 100644
--- a/app/views/directions/show.html.erb
+++ b/app/views/directions/show.html.erb
@@ -71,4 +71,7 @@
<%= t ".directions_courtesy_html", :link => tag.a("", :id => "directions_route_credit", :target => "_blank") %>
+
+ <%= t ".check_demo_html", :link => tag.a("", :id => "directions_route_demo", :target => "_blank") %>
+
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 74195dce8..9bdfb2b51 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -1612,6 +1612,7 @@ en:
download: "Download route as GeoJSON"
filename: "route"
directions_courtesy_html: "Directions courtesy of %{link}"
+ check_demo_html: "More details from %{link}"
issues:
index:
title: Issues
--
2.39.5