Use the Map Control Event API

Technologies > User Interface Add-Ins > Geographic Information System (GIS) Views > Map Control Event API

This example demonstrates using the map control event API to respond to system and user events. The standard Esri map control includes the following map events:

Event Name	Description
mapLoad	Fires when the map is loaded and ready for action.
mapViewChange	Fires when the extent of the map has changed.
mapClick	Fires when the user single clicks on the map using the mouse.
markerClick	Fires when the user single clicks on a marker using the mouse.
markerMouseOver	Fires when the user moves the mouse over a marker.
markerMouseOut	Fires when the user moves the mouse off a marker.

The general practice to respond to a map event is as follows.

In the map view controller, add an event listener with the name of the event, the name of the function to execute when the event fires, and the event context.

this.mapControl.addEventListener('mapClick', this.onMapClick, this);

In the map view controller, include the function which will execute when the event fires.

/** * Called by the map control when map is clicked. */ onMapClick: function(event) { View.log('mapController --> Map clicked!'); },

The mapLoad event is an exception to this practice.

In this case, include the name of the function to execute in the mapConfigObject , and include it in the configObject when we instantiate the map control.

// configure map properties var configObject = new Ab.view.ConfigObject(); var mapConfigObject = { "mapInitExtent" : [-8371868, 4858206, -8360699, 4864369], "mapInitExtentWKID" : 102100 }; var mapController = this; mapConfigObject.onMapLoad = function() { mapController.onMapLoad(); }; configObject.mapConfigObject = mapConfigObject; //create mapControl this.mapControl = new Ab.arcgis.Map('mapPanel', 'mapDiv', configObject);

Lastly, include the function in the map view controller.

/** * Called by the map control when the map is loaded and ready for action. */ onMapLoad: function() { View.log('mapController --> Map loaded!'); },

Sample view: http://localhost:8080/archibus/ab-arcgis-event-api.axvw