O'Reilly logo

OpenLayers 2.10 by Erik Hazzard

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Time for Action – creating a multiple map and custom event application

In this example, we'll make an application that contains two maps, side by side, that update one another when moved.

  1. Create a copy of the previous example. We'll be working on it as the basis for this example.
  2. Let's recreate the first map objects. For this example, we'll make the first map zoomed in a bit and set a maxResolution so the map cannot be zoomed out more than a few times. We'll also use two control—Navigation and PanZoomBar.
    map_1 = new OpenLayers.Map('map_1_element', { 
        controls: [ 
            new OpenLayers.Control.Navigation(), 
            new OpenLayers.Control.PanZoomBar() 
        ], 
        maxResolution:0.0054931640625, 
        minResolution:0.00034332275390625 
    });
  3. Let's also change the center point. We'll create ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required