Google Map Driving Distances

gazever · July 21, 2009

Hi I have a list of places of interest which I have their Lat & Lon for, I also have another list of villas of which I'd like to calculate the driving distances between the items.

I can output a map with the directions from one point to another, but could I just output the distances between points as a list rather than the directions. Or can I capture the javascript variable and enter into a database to retrive with php to output a list of distances.

What id like to achive is something like

Distance to Disney: 2 miles

Distance to Seaworld: 4 miles

Distance to Kennedy Space Center: 15 miles.. etc.

Or would I have to manually query every villa for every item and then enter it in a DB

I only really know PHP, javascript is new to me hence the lack of knowledge.

Google example

http://code.google.com/apis/maps/documentation/examples/directions-simple.html

HTML BELOW:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <title>Google Maps JavaScript API Example: Simple Directions</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA"
      type="text/javascript"></script>
    <script type="text/javascript"> 
// Create a directions object and register a map and DIV to hold the 
    // resulting computed directions

    var map;
    var directionsPanel;
    var directions;

    function initialize() {
      map = new GMap2(document.getElementById("map_canvas"));
      directionsPanel = document.getElementById("route");
      directions = new GDirections(map, directionsPanel);
      directions.load("from: 28.1391880, -81.3604530 to: 28.415800, -81.455905");
    }
    </script>
  </head>

  <body onload="initialize()">
    <div id="map_canvas" style="width: 70%; height: 480px; float:left; border: 1px solid black;"></div>
    <div id="route" style="width: 25%; height:480px; float:right; border; 1px solid black;"></div>
    <br/>
  </body>
</html>

Hope this makes sense

Many Thanks

Gazever

Sign In

Google Map Driving Distances

Recommended Posts

gazever

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information