[GIS] Draw route direction overlay on Google Maps or OpenLayers

google mapsopenlayers-2openstreetmapoverlay

I'd like to display the route direction generated from GraphServer on either Google Map or OpenLayers. The result I want is basically identical to how Google Map shows route directions, by highlighting road segments that incorporate the direction. The only difference is that I use GraphServer instead of Google Maps Directions API to generate route direction.

Probably the most trivial approach is to copy over the result from GraphServer, literally point-by-point from every road segments that are part of the route direction, to create polylines or DirectionsStep in Google Maps. But since this task seems to be something that is used often, I wonder if there is any easier approach. It can be either on Google Maps or OpenLayers, whichever is easier to implement.

Best Answer

From Graphserver you get a geoJson formatted file that you will be able to display with openlayers

Related Solutions

[GIS] google maps V3 : in javascript api, render route obtained with web api

You need to typecast each Object on the JSON response to the proper kind.

The web service API also doesn't return the ub property of the DirectionsResult (undocumented property), you need that as well. The DirectionsRenderer expects ub.travelMode, ub.origin and ub.destination (all strings). The origin and destination are only used if you enable the draggable property on the DirectionsRendererOptions - they are basically the same value that you pass on the DirectionsService#route() call.

Assuming you are on a browser that supports the ES5 Array#forEach method:

function typecastRoutes(routes){
    routes.forEach(function(route){
        route.bounds = asBounds(route.bounds);
        // I don't think `overview_path` is used but it exists on the
        // response of DirectionsService.route()
        route.overview_path = asPath(route.overview_polyline);

        route.legs.forEach(function(leg){
            leg.start_location = asLatLng(leg.start_location);
            leg.end_location   = asLatLng(leg.end_location);

            leg.steps.forEach(function(step){
                step.start_location = asLatLng(step.start_location);
                step.end_location   = asLatLng(step.end_location);
                step.path = asPath(step.polyline);
            });

        });
    });
}

function asBounds(boundsObject){
    return new google.maps.LatLngBounds(asLatLng(boundsObject.southwest),
                                    asLatLng(boundsObject.northeast));
}

function asLatLng(latLngObject){
    return new google.maps.LatLng(latLngObject.lat, latLngObject.lng);
}

function asPath(encodedPolyObject){
    return google.maps.geometry.encoding.decodePath( encodedPolyObject.points );
}

So you would use it like this:

var renderer = new google.maps.DirectionsRenderer();

function renderDirections(map, response, request){
    renderer.setOptions({
        directions : {
            routes : typecastRoutes(response.routes),
            // "ub" is important and not returned by web service it's an
            // object containing "origin", "destination" and "travelMode"
            ub : request
        },
        draggable : true,
        map : map
    });
}

PS: make sure you load the Geometry Library otherwise the google.maps.geometry.encoding.decodePath method won't be available.

[GIS] How do services like Google Maps compute the set of instructions for a route

You are unlikely to find the actual algorithms (would be classified as intellectual property)

Google use TeleAtlas data, since 2008 this has been owned by TomTom (know for Sat Nav products).

http://en.wikipedia.org/wiki/Tele_Atlas#Google_and_other_Internet_mapping_agreements

likewise Mapquest and Microsoft (Bing) use NavTeq owned by Nokia.

TeleAtlas capture this from multiple sources

enter image description here

After it is captured is then goes through a verification process

enter image description here

The product is available to purchase under the 'multinet' brand which is the most comprehensive of TomTom (TeleAtlas) Products with contains Navigation attributes (speed, restrictions, traffic lights, impedance factors)

multinet http://www.tomtom.com/en_gb/licensing/products/maps/multinet/ http://www.tomtom.com/en_gb/licensing/products/maps/multinet/

Sample Data is available from (Shape, File Geodatabase or DWG formats)

TomTom MultiNet With Driving Attributes Chicago, IL http://www.adci.com/html/samples/tomtom.php

Best Answer

Related Solutions

[GIS] google maps V3 : in javascript api, render route obtained with web api

[GIS] How do services like Google Maps compute the set of instructions for a route

Related Question