directions-examples
Revision as of 18:41, 1 April 2006 by JustinLilly (talk | contribs)
directions examples
Per the microformats process, the first thing to do in the investigation/creation of a new microformat is to research existing examples of directions published on the Web.
examples
Get examples from Google Maps, MSN Maps, Yahoo Maps, and note implicit schemas.
Google Maps
Start address: 50 California St San Francisco, CA 94111 End address: 10 Market St San Francisco, CA 94111 Distance: 0.2 mi (about 24 secs) Reverse directions 1. 1. Head east from California St - go 177 ft 2. 2. Turn right at Drumm St - go 149 ft 3. 3. Turn left at Market St - go 0.1 mi
====source==== (via firefox's dom inspector)
<table class="summary">
<tbody>
<tr onclick="openInfoWindow('start')" class="milestone">
<td class="name link">
<a onclick="this.blur()" href="javascript:void(0)">
Start address
</a>
:
</td>
<td class="value" id="panel_start">
50 California St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr onclick="openInfoWindow('end')" class="milestone">
<td class="name">
<a onclick="this.blur()" href="javascript:void(0)">
End address
</a>
:
</td>
<td class="value" id="panel_end">
10 Market St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr>
<td class="name">
Distance:
</td>
<td class="value">
0.2 mi (about 24 secs)
</td>
</tr>
</tbody>
</table>
<div class="reverse">
<a onclick="return loadUrl(this.href)" href="/maps?f=d&hl=en&sll=37.79449,-122.395015&sspn=0.048969,0.081711&saddr=10+market+st,+san+francisco&daddr=50+california+st,+san+francisco">
Reverse directions
</a>
</div>
<div class="printspacer noscreen">
</div>
<table class="steps">
<tbody>
<tr onclick="showPolylineBlowup('d', 0)">
<td class="num noprint">
<a href="javascript:void(0)">
1
</a>
.
</td>
<td class="num noscreen">
1.
</td>
<td id="panel_0" class="desc">
Head
<b>
east
</b>
from
<b>
California St
</b>
- go
<b>
177 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 2)">
<td class="num noprint">
<a href="javascript:void(0)">
2
</a>
.
</td>
<td class="num noscreen">
2.
</td>
<td id="panel_2" class="desc">
Turn
<b>
right
</b>
at
<b>
Drumm St
</b>
- go
<b>
149 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 4)">
<td class="num noprint">
<a href="javascript:void(0)">
3
</a>
.
</td>
<td class="num noscreen">
3.
</td>
<td id="panel_4" class="desc">
Turn
<b>
left
</b>
at
<b>
Market St
</b>
- go
<b>
0.1 mi
</b>
</td>
</tr>
</tbody>
</table>
MSN maps
Start: 1600 Pennsylvania Ave NW, Washington, DC 20006 End: 15th St NW & Constitution Ave NW, Washington, DC 20004 Total Distance: 0.6 Miles Estimated Total Time: 4 minutes Directions Miles Start: Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East) < 0.1 1: Turn RIGHT (South) onto E Executive Ave NW 0.2 2: Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW 0.4 Map Image End: Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
Source
<table class="NoBorder" border="0" width="100%"> <tr> <td class="RTText"> <span class="RouteTableStartText"> Start: </span> Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East) </td> <td class="RTText" align="Right" width="40"> < 0.1 </td> </tr> <tr> <td class="RTText"> <b> 1: </b> Turn RIGHT (South) onto E Executive Ave NW </td> <td class="RTText" align="Right" width="40"> 0.2 </td> </tr> <tr> <td class="RTText"> <b> 2: </b> Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW </td> <td class="RTText" align="Right" width="40"> 0.4 </td> </tr> </table> </td> <td class="RTRow" align="Right" valign="Top" height="10"> </td> </tr> <tr> <td class="RTRow"> <img style="border-color:#C7BCA2;" alt="Map Image" src="/I/spacer.gif" width="0" height="0" border="0" name="MapImg1"> </td> </tr> <tr> <td class="RTRowDark" valign="Top" colspan="2" rowspan="2"> <table class="NoBorder" border="0" width="100%"> <tr> <td class="RTText"> <span class="RouteTableEndText"> End: </span> Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004 </td> <td class="RTText" width="40"> </td> </tr> </table>
Yahoo Maps
Starting from: A 50 California St, San Francisco, CA, 94111-4624 Save Address Arriving At: B 10 Market St, San Francisco, CA, 94111-4801 Save Address Distance: 0.2 miles Approximate time: 1 min Get Reverse Directions Map Image Directions Show turn by turn maps 1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go < 0.1 mi 2. Turn R on DRUMM ST - go < 0.1 mi 3. Turn L on MARKET ST - go 0.1 mi 4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the L
Source
<table border=0 cellspacing=0 cellpadding=2 id="ymaprt">
<tr>
<th align=right valign=top width="1%" nowrap class="ymaprtpts"><small><b>Starting from:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_a.gif" height=16 width=16 alt="1 "> 50 California St, San Francisco, CA 94111-4624
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_from;_ylt=AoqfcLOH0rfreiqhx67WzrQa3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=50 California St&.zip=San Francisco, CA 94111-4624&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>
<tr>
<th align=right valign=top class="ymaprtpts"><small><b>Arriving at:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_b.gif" height=16 width=16 alt="2 "> 10 Market St, San Francisco, CA 94111-4801
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_to;_ylt=AiWgw9KytDi4XuzF4YWGFz0a3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=10 Market St&.zip=San Francisco, CA 94111-4801&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>
<tr>
<th align=right class="ymaprtpts"><small><b>Distance:</b></small></th>
<td width="1%" nowrap>0.2 miles</td>
<th align=right width="1%" nowrap class="ymaprtpts"><small><b>Approximate Travel Time:</b></small></th>
<td>
1 min
</td>
<td align=right valign=bottom width="1%" nowrap>
<a href="http://us.rd.yahoo.com/maps/ddresult/reverseDD;_ylt=ArvjuCZ_I5Gc4JyrHRFQIaEa3kcC/*-http://maps.yahoo.com/dd_result?ed=_YaYzuV.winqVL64AzOmYypNBUy1fFVhwugBQs_Pogbl1WImEFx_H1JxBITyDts-&name=&csz=San+Francisco%2C+CA+94111-4801&country=US&desc=&tname=&tcsz=San+Francisco%2C+CA+94111-4624&tcountry=US&tdesc=&ds=g&tbt=0&trf=0&textonly=0&oerr=&terr=">
<small class="ygver">Get Reverse Directions</small>
</a>
</td>
</tr>
</table>
Links for sending the directions
MAP IMAGE
<div id="ymapdir">
<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center><tr><th align=left><b class="ygver">Directions</b></th><th align=right><small><b>
<a href="http://us.rd.yahoo.com/maps/ddresult/tbt_on;_ylt=AtcdCayUHXlA8L0yvev28Jwa3kcC/*-http://maps.yahoo.com/dd_result?newaddr=50+California+St&taddr=10+Market+St&csz=San+Francisco%2C+CA+94111&country=us&tcsz=San+Francisco%2C+CA+94111&tcountry=us&tbt=1">Show Turn by Turn Maps</a></b></small></th></tr>
</table>
<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td>1.</td><td>Start at <b>50</b> <b>CALIFORNIA</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO</b> - go <b>< 0.1</b> mi</td></tr><tr><td>2.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_r.gif" alt=Right align=absmiddle> on <b>DRUMM</b> <b>ST</b> - go <b>< 0.1</b> mi</td></tr><tr><td>3.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> on <b>MARKET</b> <b>ST</b> - go <b>0.1</b> mi</td></tr><tr><td>4.</td><td>Arrive at <b>10</b> <b>MARKET</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO,</b> on the <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> </td></tr></table>
</div>