Back

Add Listener

This page covers event listener method of the map object only.

Event listener lets you track user interactions on the map such as click, double click, drag and many more. See list of events below.

To add an event listener on the map call the AddListener method of the map object like this:

 map.AddListener(event, callback)

event String
Required. The event you want to track.
callback String
Required. The function to be called when the event is fired. This is the string name of the function.

Return: Listener object

Make sure that all the listener callbacks must be accessiblle globally. Listener callback defined within a function throws an error saying "Function `callback` is not defined".

Available events

bounds_changed, center_changed, click, dblclick, drag, dragend, dragstart, heading_changed, idle, maptypeid_changed, tilesloaded, tilt_changed, zoom_changed

This will return a stringified object. So before you can use the object, parse it first using JSON.parse().

Click event

app.LoadPlugin("MapView");
var marker;
function OnStart() {
    lay = app.CreateLayout("Linear", "VCenter, FillXY");
        
        var apiKey = "AIzaSyD2eHntKEmh272p3ac6YjWPbPkwo3m2mck";
        
        map = app.CreateMapView(apiKey, 0.9, 0.5, 37.775, -122.434, 13);
        map.SetOnReady(MapOnReady);
        lay.AddChild(map);

    app.AddLayout(lay);
}
function MapOnReady() {
    map.AddListener("click", "OnMapClick");
}
function OnMapClick(ev) {
    var data = JSON.parse(ev);
    var pos = data.latLng;
    map.CreateMarker(pos.lat, pos.lng);
}
Copy    Run   

Drag event

app.LoadPlugin("MapView");
var marker;
function OnStart() {
    lay = app.CreateLayout("Linear", "VCenter, FillXY");
        
        var apiKey = "AIzaSyD2eHntKEmh272p3ac6YjWPbPkwo3m2mck";
        
        map = app.CreateMapView(apiKey, 0.9, 0.5, 37.775, -122.434, 13);
        map.SetOnReady(MapOnReady);
        lay.AddChild(map);

    app.AddLayout(lay);
}
function MapOnReady() {
    map.AddListener("dragstart", "OnDragStart");
    map.AddListener("dragend", "OnDragEnd");
}
function OnDragStart(ev) {
    app.ShowPopup("Start: "+ev);
}
function OnDragEnd(ev) {
    app.ShowPopup("End: "+ev);
}
Copy    Run