README.md

Description

Ever wanted to offer driving directions from your website instead of settling for a link to just a map? It's easier than you might think, no ASP or CGI involved, just plain old HTML. This also adds a whole new element to your website that's just plain neat.

More Info

Submitted On
By	Joe Maddalone
Level	Beginner
User Rating	5.0 (20 globes from 4 users)
Compatibility	ASP (Active Server Pages), HTML
Category	Miscellaneous
World	ASP / VbScript
Archive File

Source Code

This is a technique I developed back in 2000-ish for one of my first commercial clients. I had actually offered it up before I was even sure I could do it, but nonetheless I found a way to tap into the mapquest.com driving directions
application.

Ever wanted to offer driving directions from your website instead of settling for a link to just a map? It's easier than you might think, no ASP or CGI involved, just plain old HTML. This also adds a whole new element to your website that's just plain neat.

The code here has been modified from my original version so that it is now XHTML 1.0 Valid.

This is pretty much a simple copy and paste job, but I'll go over it once for you.

When you go to mapquest and request driving directions from one point to another the URL you get is something like this:

http://www.mapquest.com/directions/main.adp?go=1
&do=nw&ct=NA&1y=US&1a=233+South+Wacker+Drive
&1p=&1c=Chicago&1s=IL&1z=60606&1ah=&2y=US
&2a=1+Microsoft+Way&2p=&2c=Redmond&2s=WA
&2z=98052&2ah=&lr=2&x=57&y=15

In this example I used Chicago's Wrigley Field as the "From" address

233 S Wacker Dr
Chicago, IL
60606

And the Microsft Headquartersas the "To" address

1 Microsoft Way
Redmond, WA
20005

Now the task is to break this long, long URL down. By breaking it at each ampersand we can get a better look at this it.

http://www.mapquest.com/directions/main.adp?
go=1
&do=nw
&ct=NA
&1y=US
&1a=233+South+Wacker+Drive
&1p=
&1c=Chicago
&1s=IL
&1z=60606
&1ah=
&2y=US
&2a=1+Microsoft+Way
&2p=
&2c=Redmond
&2s=WA
&2z=98052
&2ah=
&lr=2
&x=57
&y=15

Now I make no allusion to understanding every single bit of that, I do however know what I need to know. Granted this is for US addresses only, if you want international values you'll have to look into that one on you own.

So by further breaking the URL down we see that:

http://www.mapquest.com/directions/main.adp?

is the page that is being posted to by mapquest, so this is where we too must post to..

and there are only 4 lines that seem particular to our "to" address

&2a=1+Microsoft+Way
&2c=Redmond
&2s=WA
&2z=98052

These are our constants, this is our address, basically
After we remove these we are left with

go=1
&do=nw
&ct=NA
&1y=US
&1a=233+South+Wacker+Drive
&1p=
&1c=Chicago
&1s=IL
&1z=60606
&1ah=
&2y=US
&2ah=
&lr=2
&x=57
&y=15

This is the information we want our website visitor to enter.

So putting this into a form would look like this:

<form name="ddform" action=http://mapquest.com/directions/main.adp target=_blank method=get>

<!--hidden fields-->
<input type="hidden" name='go' value='1'>
<input type="hidden" name='do' value='nw'>
<input type="hidden" name='ct' value='NA'>
<input type="hidden" name='1ah' value=''>

<!--The From Street-->
Street:<input name='1a' type=text size="15"><br />

<!--hidden field-->
<input type="hidden" name='1p' value=''>

<!--The From City-->
City:<input name='1c' type=text size="15"><br />

<!--The From State-->
State: <input name='1s' type=text size="5"><br />

<!--The From Zip Code-->
Zip:<input name="1z" type="text" size="15"><br />

<!--hidden field-->
<input type="hidden" name='z' value=''>

<!--hidden field for From Country-->
<input type="hidden" name='1y' value='US'>

<!--hidden field-->
<input type="hidden" name='2ah' value=''>

<!--hidden field for To Street Address-->
<input type="hidden" name='2a' value=1+Microsoft+Way'>

<!--hidden field-->
<input type="hidden" name='2p' value=''>

<!--hidden field for To City-->
<input type="hidden" name='2c' value=Redmond'>

<!--hidden field for To State-->
<input type="hidden" name='2s' value='WA'>

<!--hidden field for To Zip Code-->
<input type="hidden" name='2z' value='98052'>

<!--hidden field for the To Country-->
<input type="hidden" name='2y' value='US'>

<!--hidden field-->
<input type="hidden" name='lr' value='2'>
<input type="hidden" name='x' value='75'>
<input type="hidden" name='y' value='8'>
<br />
<br />
<input type=submit value='Submit'>
</form>

And there you have it.
If your business was located at the Ms headquarters anybody could get direction right from your website. Here's a working Example

Street: City: State:

In a follow up article to this I'll approach the same concept using databases for this process.