Building A Dynamic Link To Directions In Google Maps
Normally if you wanted to get directions between two places, you’d go to Google Maps and enter two locations; your starting position and destination. In doing this you can then copy the direct link which will look something like so:
Easy, right? But what if we want don’t know both of the locations?
To begin with and to make things easier, we can reduce the URL above down even further by removing a lot of the parameters, so it just becomes:
The parameter ‘saddr’ (ie. start address) is where the directions will begin, and ‘daddr’ (ie. destination address) is where they will terminate. It’s important to understand which is which as we don’t want to provide directions the wrong way.
Now, lets imagine that a company has a ‘Contact Us’ page on their website, and they want to provide users with the ability to get directions to their offices. We know the companies address, but we don’t know the user’s address. As a result we might have a form that looks something like so:
<form action="http://maps.google.com/maps" method="get" target="_blank"> <input type="text" name="saddr" value=""> <input type="text" name="daddr" value="The companies address"> <input type="submit" name="Submit" value="Get Directions"> </form>
When the user enters their address, the form will submit to Google Maps in a new tab/window and will open with the directions loaded by default.