EMS : Custom controls

You don't need to use the map controls supplied by the EMS JavaScript API. Provided you always include a copyright control on every EMS map, all other controls are optional.

Having established that you can pan and zoom the map programmatically, you can trigger these events in any of several ways. For example:

• Wait for a key press. Gaming applications, for example, frequently pan the interface using keyboard input, such as i=north, m=south, j=west, k=east. In this case, create a listener for an onkeydown event. When the event occurs, test for the keycode and perform the pan or zoom operation accordingly.
• Add onclick or ondrag events to customised graphics or animations. You might pan the map when a user clicks a compass, or pan further depending how far a user clicks and drags a quasi-joystick.
• If you want to use customised graphics instead of the supplied on-map panning arrows, use the extended PanButton constructors to nominate a customised icon.

Right-click

You can replace the default right-click (or context) menu by implementing the contextMenuControl.

The following code runs the showMenu function when right click occurs, and the hideMenu function when the click is released. Note that those functions need not actually display a menu. Any appropriate action may be performed.

var menuCallbacks =

{showMenu: this.showMenu, hideMenu: this.hideMenu};

var contextMenuControl = new EMS.Control.ContextMenu(this, menuCallbacks, []);

function showMenu(){

     //user right-clicked the map

}

function hideMenu(){

     //user released the mouse button

}

 

map.addControl( contextMenuControl );
contextMenuControl.activate();

To add a fully customised control to the map, use OpenLayers functionality with which you can encapsulate any online graphic, size, and position it on the map.