How to use OSRM's match service

Question

As stated in the header: how can I use the match call?
I tried

http://router.project-osrm.org/match/v1/driving/8.610048,46.99917;8.530232,47.051?overview=full&radiuses=49;49

I am not sure, whether the list of radiuses is given correctly. I can't get it work. I also tried [49;49] or {49;49} The command works with route:

http://router.project-osrm.org/route/v1/driving/8.610048,46.99917;8.530232,47.051?overview=full

For backround see here

Edit: If you look at the example here, itr seems, the timestamps are not needed /match/v1/{profile}/{coordinates}?steps={true|false}&geometries={polyline|polyline6|geojson}&overview={simplified|full|false}&annotations={true|false}

Answer 1

From the docs:

Large jumps in the timestamps (> 60s) or improbable transitions lead to trace splits if a complete matching could not be found.

I think that's the problem with your request. The two given points are more than 60s appart and OSRM cannot match them successfully. The radiuses are specified correctly.

The following query works for me:

http://router.project-osrm.org/match/v1/driving/8.610048,46.99917;8.620048,46.99917?overview=full&radiuses=49;49

This returns:

{"tracepoints":[{"location":[8.610971,46.998963],"name":"Alte Kantonstrasse","hint":"GKUFgJEhBwAAAAAAHQAAAAAAAAC5AAAAAAAAAB0AAAAAAAAAuQAAAPsCAACbZIMAsyXNAgBhgwCCJs0CAAAPABki8hY=","matchings_index":0,"waypoint_index":0,"alternatives_count":0},{"location":[8.620295,46.999681],"name":"Schönenbuchstrasse","hint":"nIEFAJ7IFIA3AAAAZAAAAAAAAADYAAAANwAAAGQAAAAAAAAA2AAAAPsCAAAHiYMAgSjNAhCIgwCCJs0CAAAPABki8hY=","matchings_index":0,"waypoint_index":1,"alternatives_count":5}],"matchings":[{"distance":922.3,"duration":114.1,"weight":114.1,"weight_name":"routability","geometry":"onz}Gqyps@Wg@S_@aCaFMUYo@c@w@OKOCWmAWs@aBiDsAsCMYH[HY\\_@h@ObBW^w@BQAUKu@ASF[ZaABOFYpAyIf@mD","confidence":0.000982,"legs":[{"distance":922.3,"duration":114.1,"weight":114.1,"summary":"","steps":[]}]}],"code":"Ok"}

So the two given input points 8.610048,46.99917 and 8.620048,46.99917 are matched to 8.610971,46.998963 and 8.620295,46.999681.

So as far as I can see, if you want to implement something like that, you need to give OSRM more input points on its way which are less than 60s apart.

See also here for an explanation about the differences between route and match service.

Answer 2

Here a jsFiddle demo for you, showing how to use OSRM map matching service.

Click 5 times at the map and the map matched route will be drawn in red color:

Below is the copy of my Javascript code (license: public domain):

'use strict';

function processOsrmReply(data) {

  console.log('Received OSRM map matching reply:');
  console.log(data);

  for (var i = 0; i < data.matchings.length; i++) {
    var matching = data.matchings[i];
    var coordinates = matching.geometry.coordinates;
    var latLngs = coordinates.map(coordinate => [coordinate[1], coordinate[0]]);
    L.polyline(latLngs, { color: 'red' }).addTo(linesGroup);
  }
}

function sendOsrmRequest(lngLats) {
  // create an array of radiuses, same length as lngLats array
  var radiuses = lngLats.map(lngLat => 49);

  var url = 'https://router.project-osrm.org/match/v1/driving/' +
    lngLats.join(';') +
    '?overview=simplified' +
    '&radiuses=' +
    radiuses.join(';') +
    '&generate_hints=false' +
    '&skip_waypoints=true' +
    '&gaps=ignore' +
    '&geometries=geojson';

  console.log('Sending OSRM map matching query to the URL ' + url);

  var request = new XMLHttpRequest();
  request.open('GET', url, true);
  request.onload = function() {
    if (this.status >= 200 && this.status < 400) {
      var data = JSON.parse(this.response);
      processOsrmReply(data);
    } else {
      console.log('Error: ' + this.status);
      // remove polylines and markers
      linesGroup.clearLayers();
      markersGroup.clearLayers();
    }
  };
  request.send();
}

function processMapClick(ev) {
  // get the count of currently displayed markers
  var markersCount = markersGroup.getLayers().length;
  if (markersCount < MARKERS_MAX) {
    L.marker(ev.latlng).addTo(markersGroup);
    // remove polylines
    linesGroup.clearLayers();
    // connect all markers in the markersGroup by a blue polyline
    var latLngs = markersGroup.getLayers().map(marker => marker.getLatLng());
    L.polyline(latLngs, { color: 'blue' }).addTo(linesGroup);
    return;
  }

  // get the count of currently displayed polylines
  var linesCount = linesGroup.getLayers().length;
  if (linesCount > 1) {
    // remove polylines and markers
    linesGroup.clearLayers();
    markersGroup.clearLayers();
    return;
  }

  // create an array of string: "lng,lat" with 6 digits after comma
  var lngLats = markersGroup.getLayers().map(marker =>
    parseFloat(marker.getLatLng().lng).toFixed(6) + ',' +
    parseFloat(marker.getLatLng().lat).toFixed(6)
  );

  sendOsrmRequest(lngLats);
}

var MARKERS_MAX = 4;
var startPosition = [51.4661, 7.2491];
var map = L.map('map').setView(startPosition, 14).on('click', processMapClick);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

// layer groups for markers and polylines
var markersGroup = L.layerGroup();
map.addLayer(markersGroup);
var linesGroup = L.layerGroup();
map.addLayer(linesGroup);

html, body { 
  margin: 0;
  padding: 0;
}

#map {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
}

#status {
  text-align: center;
  position: absolute;
  z-index: 2;
  width: 100%;
}

<link href="https://cdn.jsdelivr.net/npm/leaflet@1/dist/leaflet.min.css" type="text/css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/leaflet@1/dist/leaflet-src.min.js"></script>

<div id="status">Click 5x at the map to send OSRM map matching request</div>
<div id="map"></div>