javascript - How to use OSRM match api in leaflet to draw a route? - Stack Overflow

admin管理员组

文章数量:1332353

I have some gps generated data during a drive.

var routeArr = [{lng1, lat1}, {lng2,lat2}, {lng3, lat3}.....];

I want to show this generated data as actual route traveled on a Leaflet powered Openstreet map. My naive approach is to show a polyline connecting all points. But I want to show actual route which was followed while driving. Can I use OSRM-Backend API with leaflet-routing-machine plugin for this? Any help will be much appreciated.

I have some gps generated data during a drive.

var routeArr = [{lng1, lat1}, {lng2,lat2}, {lng3, lat3}.....];

I want to show this generated data as actual route traveled on a Leaflet powered Openstreet map. My naive approach is to show a polyline connecting all points. But I want to show actual route which was followed while driving. Can I use OSRM-Backend API with leaflet-routing-machine plugin for this? Any help will be much appreciated.

• javascript
• leaflet
• osrm
• map-matching
• leaflet-routing-machine

Share Improve this question Follow edited May 20, 2016 at 11:31 Anant asked May 20, 2016 at 11:22 AnantAnant 3,07733 gold badges2828 silver badges3333 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

Sadly there is not drop-in way to use this with LRM since the APIs work slightly differently.

1. The response contains tracepoints and matchings instead of waypoints and routes
2. An object in the matchings array is similar to a Route object but it represent sections of the gps trace that could be matched, not alternative routes like in the route plugin.

Easiest way to just deploy this on a map would be to run a query against:

http://router.project-osrm/match/v1/driving/{lon,lat};{lon,lat};...?overview=full

And then use https://github./mapbox/polyline and the following snippet to add the geometry on a map:

var polyline = require('polyline');

/* fetch the URL and save JSON in response */

response.matchings.map((m) => L.polyline(polyline.decode(m.geometry)).addTo(map));

本文标签： javascriptHow to use OSRM match api in leaflet to draw a routeStack Overflow