Leaflet.js Essentials

Events and event handlers

So far, you have created maps that display data and added a pop up that displayed when the user clicked on a marker. Now, you will learn how to handle other events and assign these events to event handler functions to process them and do something as a result.

You will first learn how to handle a map event. There are 34 events in the map class that can be subscribed to. This example will focus on the click event. To subscribe to an event, you use the event method .on(); so, for a map event, you use the map.on() method and pass the parameters as the event and function to handle the event. This is shown in the following code:

map.on('click', function(){alert("You clicked the map");});

The code tells Leaflet to send an alert ...