Displaying results of google direction web service without using javascript api

Question

I am developing a application which will find direction between 2 points, display it on the google map and store it in server side so that I can render it again when needed also to compare one route to another route.
I have successfully used the google maps api web serivce to find the route and a I have also used the google maps javascript v3 to find the route and display it on the map using DirectionsRenderer.
Both of these services return similar JSON with the difference in the name of properties of JSON (see example 1 below). More importantly the JS api return different property names for lat/lng from one invocation to another (see example 2 below).

So the problem is I cannot use the JSON obtained from server side web service call and directly pass it on to the javascripts DirectionRenderer class to display the route. Moreover, I have to make a JS call everytime I have display the route on the map. This will cause unnecessary usage of my quota. Is there any better way to do this. I have gone through the following questions but I cannot actually get the answer here and here

example 1 :

Web serivce call result :

{
    "routes" : [
      {
         "bounds" : {
            "northeast" : {
               "lat" : 12.9198217,
               "lng" : 77.6124895
            },
            "southwest" : {
               "lat" : 12.912811,
               "lng" : 77.60924989999999
            }
         },
          .....

This does not have a "path" property.

Javascript V3 call result :

{
"routes": [
    {
        "bounds": {
            "ta": {
                "d": 12.91281,
                "b": 12.919820000000001
            },
            "ga": {
                "b": 77.60925,
                "d": 77.61249000000001
            }
        },
        ......
        "path": [
                            {
                                "d": 12.913920000000001,
                                "e": 77.60928000000001
                            },
                            {
                                "d": 12.913960000000001,
                                "e": 77.60958000000001
                            },
                            {
                                "d": 12.91398,
                                "e": 77.61
                            }
                        ],
                        ..........

example 2 : Another Javascript V3 call result :

{
"routes": [
    {
        "bounds": {
            "Aa": {
                "k": 12.91281,
                "j": 12.919820000000001
            },
            "qa": {
                "j": 77.60925,
                "k": 77.61249000000001
            }
        },
        .....
        "path": [
                            {
                                "k": 12.91281,
                                "A": 77.60925
                            },
                            {
                                "k": 12.913920000000001,
                                "A": 77.60928000000001
                            }
                        ],
                        .........

Adduce

Do I need to include any other detail – Adduce

Why am I not getting any responses? – Adduce

Hi, Could you make it work ? – Putnam

Answer 1

You can do this, but there are several gotchas.

First, make sure your app is compliant with point 10.5.d here: https://developers.google.com/maps/terms#10-license-restrictions

Unlike the JSON response from Directions API web service, which has consistently named fields, the JSON response from the JavaScript Directions service is not for you to parse. Instead, you need to access the DirectionsResult object as a JavaScript object, which contains google.maps.LatLng objects, e.g. routes[0].legs[0].steps[0].start_location

https://developers.google.com/maps/documentation/javascript/directions#DirectionsResults https://developers.google.com/maps/documentation/javascript/directions#Steps

For a route you've gotten from the Directions API web service, there are several ways to display it on the JavaScript API. My preference would be to "translate" the JSON response into a DirectionsResult object. You can do this on your server or in JavaScript, but I think the former is better.

Alternatively, you can re-query the Directions service (using the JavaScript service) to get the route again. Not only will this consume additional quota, it may also return a different (more up-to-date) route. Whether that's good or bad, it depends on what you want.

Procrustean