Time for Action – working with Map events

1. Before the map object is instantiated, let's create a function that will get called when the map's zoomend event is called. First, we'll create the function:

   function zoomend_event(event){
     alert('Done zooming');
   }

2. Let's add another function after that which will update the first layer's opacity to a random value when the map is finished being moved. First, create the function:

   function update_opacity(event){
     map.layers[0].setOpacity(Math.random());
   }

3. Now we're going to create the map object. Use the following code to instantiate the map object, passing in event listeners for zoomend and moveend:

   map = new OpenLayers.Map('map_element', {
     eventListeners: {
       'zoomend': zoomend_event,
       'moveend': update_opacity
     }
   });

4. Be sure to add a WMS layer to the map, along with setting the extent like we've done before. Now, open up the map and start navigating around it. When you zoom in, you should receive an alert. When you finish panning, the layer's...