How to display value from Distance Matrix?

Question

I have something like this:

http://maps.googleapis.com/maps/api/distancematrix/json?origins=Berlin&destinations=Frankfurt&mode=driving&language=de-DE&sensor=false

How to display "549 km and 5 Stunden, 21 Minuten" from this json output in my website?

I think we will need more information to help you. Are you accessing that URL on the server or on the client? What function, library, or other tool are you using to access it? — Elias Zamaria

Elias Zamaria Elias Zamaria · Accepted Answer · 2012-10-29T23:42:12

Something like this:

var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
  {
    origins: ["Berlin"],
    destinations: ["Frankfurt"],
    travelMode: google.maps.TravelMode.DRIVING,
  }, callback);

function callback(response, status) {
  $("#result").text(response.rows[0].elements.distance.text + " and " + response.rows[0].elements.duration.text);
}

It looks fine to me but I haven't tested it so I may not be getting all the details right. I don't know how to get the result in German but this documentation may be helpful.

In place of $("#result"), you need a selector or collection for the element where you want to show the result.

How to display value from Distance Matrix?

1 Answers