Multimap API V1.2 JavaScript Example

Options *new*

The Multimap API now allows you to control every aspect of your application's appearance and behavior when users interact with it. It replaces older features that controlled panning, zooming and dragging a map.

Controls and settings are available which allow you to determine the behavior of your map when a user performs various actions with a keyboard, mouse or both. It also controls which options are visible on the Context Menu (which appears when a user right-clicks on the map area) and determines whether units of distance are shown on the map in miles (and yards) or kilometers (and meters).

For information of the default settings for the Multimap API, please read the release notes.

Function(s) introduced:

MultimapViewer: getOption(), setOptions()

What You Should See

If you view this in your browser you should see a Multimap draggable map centered on Saint James Avenue, Boston, Massachusetts, USA, at zoom factor 15.

First drop-down list - actions

Clicking on this drop-down lists selects the kind of action for which you wish to specify an effect to take place when the user performs an action such as double-clicking, right-clicking, scrolling the mousewheel (while the mouse's pointer has the map's focus) or dragging the map, possibly in accordance with a key such as Ctrl, Shift or Alt.

This list also include several settings which control the options that are visible in the Context Menu, whether or not the 'smooth panning' and 'smooth zooming' methods are switched on and whether the API displays metric or Imperial units.

Second drop-down list - behavior

Clicking on this list determines the effect that the action selected in the first drop-down list will have, or the setting that will change, when you press the "Change option" button.

Important Note(s):

• The effect of combining keystrokes and mousewheel movements may vary depending on your browser; if certain actions (such as combining the Shift key with a mousewheel action) are handled at the level of the browser, they will not be available to the API through that browser.

Restore default settings

Clicking on this option displays all the default settings supplied in the API for the controls that this example describes and restores all actions and affordances to the settings that they had when the page was first opened.

The Map

The Code

There are three 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.

The header code

<script type="text/javascript" src="http://clients.multimap.com/API/maps/1.2/demo"></script>

The body code

Sorry, JavaScript required...

Sorry, JavaScript required...

The JavaScript code

Sorry, JavaScript required...

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

Back to examples.

Further Help

If you require further help with your map API implementation, please contact the Multimap Customer Support team:

For general account enquiries or further services, please contact the Multimap Sales team: