Rafael Sanches

July 23, 2009

Retrieve driving directions from google maps with server-side HTTP calls and show results with static maps for WAP

Filed under: maps — Tags: , , , , , , , , , — mufumbo @ 8:32 am

Edit may 2010: Google has released the directions API. Documentation is available here.

Mobile phones are not famous for supporting javascript. A problem arises when you need to use google API to retrieve the driver directions for a mobile site, or when you just don’t want your site to be overloaded with the complete maps toolkit to show a simple map.

Google provides a good directions-static demo but, unfortunately, it’s javascript-only. They don’t have any example or documentation about how to generate the directions through server side HTTP call.

The driving direction API doesn’t seem to be 100%. I wasn’t able to find examples of how to use the directions API with google maps API-V3 javascript, it seems that it’s not ready yet. I’ve founded this issue tracking in gmaps-api-issues (by the way, the most voted issue) that says that there isn’t support for google maps directions through server side http calls.

Putting all together: I have decided to check what HTTP calls the directions API of google maps API-V2 does and to use it in the server side. I don’t know if it’s forbidden in the terms of service, but it works!

Basically, my PHP server-side is doing the exact same thing that the google directions-static demo is doing in javascript (checkout the source code of the page). It retrieves the answer from the server and write the coordinates information in the  static maps URL.

Note that HttpHelper::doGET downloads the string, you can substitute that part with CURL or fopen. Here is the code to make the HTTP calls to get the driving directions and to create the static map image link:

<?php
class GoogleGeo {
    public static function buildStaticMap($center, $markers=array(), $width=400, $height=400, $zoom=12, $directions=null) {
        $strMarkers = "";
        foreach($markers as $marker) {
            if (!empty($strMarkers)) $strMarkers .= '|';
            $strMarkers .= urlencode($marker);
        }
        if ($width > 640) $width = 640;
        if (!empty($center)) {
            $center = "&center=".$center;
        }
        if (!empty($strMarkers)) {
            $strMarkers = "&markers=".$strMarkers;
        }
        if ($zoom > 0) {
            $zoom = "&zoom=$zoom";
        }

        $steps = "";
        if (!empty($directions)) {
            foreach($directions['Directions']['Routes'][0]['Steps'] as $step) {
                $lat = $step['Point']['coordinates'][1];
                $lon = $step['Point']['coordinates'][0];
                if (!empty($steps)) $steps .= "|";
                $steps .= $lat.",".$lon;
            }
            if (!empty($steps)) {
                $steps .= "|".$directions['Directions']['Routes'][0]['End']['coordinates'][1].",".$directions['Directions']['Routes'][0]['End']['coordinates'][0];
                $steps = "&path=rgb:0x0000ff,weight:5|".$steps;
            }
        }

        $staticMap = "http://maps.google.com/staticmap?maptype=mobile&size=".$width."x$height&maptype=roadmap&key=".GOOGLE_MAPS_KEY."&sensor=false$strMarkers$center$zoom$steps";
        return $staticMap;
    }

    public static function retrieveDirections ($from, $to) {
        $params = array('key' => GOOGLE_MAPS_KEY, 'output' => 'json', 'q' => "from: $from to: $to");
        $url = "http://maps.google.com/maps/nav";
        $result = HttpHelper::doGET($url, $params);
        $result = json_decode($result, true);
        return $result;
    }
}
?>

A example how to use this code is:

<?php
...
    /* FROM and TO coordinates */
    $markers = array("37.262568,-121.962232,redr", "37.229898,-121.971853,blueg");
    /* Get the driving directions from google api */
    $directions = GoogleGeo::retrieveDirections("485 Alberto Way, Suite 210. Los Gatos, CA 95032", "14109 Winchester Bl, Los Gatos, CA");
    /* Create the map image url with the directions coordinates */
    $staticMap = GoogleGeo::buildStaticMap(null, $markers, 640, 240, null, $directions);
....
?>

In this way you will have $staticMap with a value similar to the image urls in the directions-static demo. In this case it will be:

http://maps.google.com/staticmap?maptype=mobile&size=640×240&maptype=roadmap&key=YOUR_GOOGLE_KEY&sensor=false&markers=37.262568%2C-121.962232%2Credr|37.229898%2C-121.971853%2Cblueg&path=rgb:0x0000ff,weight:5|37.22898,-121.97104|37.22818,-121.97112|37.22597,-121.97231|37.22892,-121.98063|37.23713,-121.97714|37.26301,-121.96088|37.262282,-121.961628

The variable $directions will contain a array with the complete direction steps, so you can easily loop through it and print it out on your WAP application.

Blog at WordPress.com.

%d bloggers like this: