How do you access individual elements in Google Maps?
Is there a way to do this through the API or will I have to parse the DOM and pull the elements (e.g., distance, time, directions) separately? Version 2 or 3 of the API is fine.
Example:
<div jstcache="6" style="text-align: right; padding-bottom: 0.3em;"
jseval="this.innerHTML = $Route.summaryHtml">38.9 mi (about 40 mins)</div>
I want just the distance (e.g., 38.9 mi) for a Javascript calculation. If nothing exists in the API, I'll parse it out manually.
Thanks, Mark
Note: This is the full example site I'm using: http://code.google.com/intl/en-EN/apis/maps/documentation/examples/directions-advanced.html
Update with simplified solution:
For those that need it, here is a very simple full HTML page that I was able to thin out from the example that Cannonade posted. This has all styling and other scripts removed:
<html>
<head>
<script src="maps.google.com/maps?file=api&v=2.x&a…; type="text/javascript"></script>
<script>
function initialize()
{
alert("loading ...");
if (GBrowserIsCompatible())
{
var wp = new Array ();
wp[0] = new GLatLng(32.742149,119.337218);
wp[1] = new GLatLng(32.735347,119.328485);
directions = new GDirections(); directions.loadFromWaypoints(wp);
GEvent.addListener(directions, "load", function()
{
alert(directions.getDuration().seconds);
});
}
else
{
alert("Sorry, the Google Maps API is not compatible with this browser");
}
}
</script>
</head>
<body onload="initialize();" onunload="GUnload();"></body>
</html>
Put the codesamples into index.html and you'll be set.