CODEWITHSUNDEEP
javascriptjqueryajaxopenstreetmaposrm
NickF
NickF

Reputation: 169

Getting JSON for OSRM routing

I have successfully implemented a routing system at my website using the cloudmade API. I also want to do the same with the OSRM routing system (https://github.com/DennisOSRM/Project-OSRM) but I'm having some trouble getting the OSRM json output.

Here are examples of retrieving json from the cloudmade API:

Using $.ajax - http://jsfiddle.net/mayooresan/FhfVW/2/

$(function () {
$("#getJSON").click(function () {
    var url = "http://routes.cloudmade.com/c6f2762bfe00414f822a9dec443569f5/api/0.3/51.500,0.100,51.500,0.1001/car.js";
    $.ajax({
        async: false,
        dataType: "jsonp",
        url: url,
        success: function (data) {
            test = data.route_geometry;
            alert(test);
        }
    });
});
});

Using $.getJSON - http://jsfiddle.net/V3qgZ/72/

$(function () {

$("#getJSON").click(function () {

    $.getJSON("http://routes.cloudmade.com/c6f2762bfe00414f822a9dec443569f5/api/0.3/51.500,0.100,51.500,0.1001/car.js?callback=?", function (data) {
        var test = data.route_geometry;
        alert(test);
    });
});
});

The server API for OSRM is located here: https://github.com/DennisOSRM/Project-OSRM/wiki/Server-api (The server location for queries is located at http://router.project-osrm.org).

Putting the URL with the same coordinates used above (http://router.project-osrm.org/viaroute?loc=51.500,0.100&loc=51.500,0.1001) into the browser retrieves a json file. But no matter what I have tried using this with $.getJSON or $.ajax - using callbacks, setting datatypes, I cannot get the json data and it is driving me nuts! And I'm sure it's possible because it is documented in the API.

Upvotes: 0

Views: 7308

Answers (3)

danylaksono
danylaksono

Reputation: 31

Time pass, and I guess I'll just answer this, just in case someone is having the same problem.

OSRM's JSON response is different than the one returned by Cloudmade. OSRM wiki in your question actually answer that. JSON from OSRM is encoded, and you need special treatment to that. Quoting the wiki,

The geometry of the route is transferred in encoded form.

Long story short, someone has already made things easy for us. Take a look at this: https://github.com/perliedman/leaflet-routing-machine

Upvotes: 3

Jussi Kukkonen
Jussi Kukkonen

Reputation: 14587

This is a jquery thing: New versions add a callback parameter by default so your url ends up as something like http://router.project-osrm.org/viaroute?loc=51.500,0.100&loc=51.500,0.1001&callback=jQuery1504317377423867583_1366895174226&_=1366895275399 . OSRM does not like this.

See answers to "why callback parameter is added to query string using jQuery AJAX request" for advice on how to prevent this.

Upvotes: 0

Vicky Gonsalves
Vicky Gonsalves

Reputation: 11717

try this : (Actually jQuery parses the json internally)

Check this fiddle

$(function () {

$("#getJSON").click(function () {

$.getJSON("http://routes.cloudmade.com/c6f2762bfe00414f822a9dec443569f5/api/0.3/51.500,0.100,51.500,0.1001/car.js?callback=?", function (data) {
    var test = data.route_geometry;
            alert(JSON.stringify(test));

    });
});
});

Upvotes: 0

Related Questions