Multimap logo Multimap API V1.2 JavaScript Example

Routing - Tailoring Route Output *new*

This example demonstrates how Multimap's API can be used to alter the way in which routes are calculated and route information is displayed.

You can use the API to generate routes between two or more locations, specifying options such as locale (language), optimization method, road exclusions and mode of travel.

What You Should See

If you view this in your browser you should see a Multimap draggable map centered on Fleet Street, London, Great Britain, at zoom factor 15.

To generate a route:

  1. Choose the locale (language) in which you would like your route instructions to be displayed. (For more details on locales, please see the separate topic on Changing Local Language Settings.)
  2. Choose whether you would like your route to be optimized to be 'Quickest' (shortest amount of time from start to finish) or 'Shortest' (shortest travelling distance from start to finish).
  3. Choose the mode for your route: you may choose a walking route or a driving route.
  4. Choose whether to exclude highways. If selected, the returned route will avoid major roads when possible.
  5. Click on the "Go" button to view your results.
  6. Your route is displayed, highlighted on a draggable map, with a numbered series of travel directions listed below it; each of the list's numbered instructions is shown on the map as a marker with an info box.

A journey with 'via' points is listed beneath the map in separate stages.

Please note that the start, end and 'via' points on the route are fixed: the route starts in London, goes via Reading and finishes in Guildford. In this example the latitude and longitude that correspond to these locations are passed in as 'locations' for the route.

Important note: You must display copyright and disclaimer notices when providing travel directions.

The Map
Get directions:














Messages and results will be placed here

The Code

There are four parts to the code below. The first is the line that links to the Multimap API. The second is an example of the HTML you must have in your page. The third is an example of the JavaScript required to implement the page. Finally, the fourth is the CSS code that you should add to your web page.

The header code

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" >
<script type="text/javascript" src="http://clients.multimap.com/API/maps/1.2/demo"></script>

The body code

Sorry, JavaScript required...
Sorry, JavaScript required...
Sorry, JavaScript required...

The JavaScript code

Sorry, JavaScript required...

The CSS code

Sorry, JavaScript required...

Note on printing

Please note that you may not be able to print a highlighted route or a polyline from the Multimap API when using a Mozilla Firefox or an Opera browser. If you encounter such a problem, please try a different browser.

For more information on the subject of Multimap API JavaScript code, please read the API documentation at: http://clients.multimap.com/share/documentation/api/1.2/classes/.

Back to examples.

Further Help

If you require further help with your Multimap service implementation, additional Multimap services or general account enquiries, please contact Multimap:

Sales: +44 (0)20 7632 7800
Customer Support: +44 (0)20 7632 7777
email: mminform@microsoft.com