~mortenoh/+junk/dhis2-detailed-import-export

« back to all changes in this revision

Viewing changes to gis/dhis-gis-geostat/mfbase/openlayers/examples/restricted-extent.html

  • Committer: larshelge at gmail
  • Date: 2009-03-03 16:46:36 UTC
  • Revision ID: larshelge@gmail.com-20090303164636-2sjlrquo7ib1gf7r
Initial check-in

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
<html xmlns="http://www.w3.org/1999/xhtml">
 
2
  <head>
 
3
    <title>OpenLayers Restricted Extent Example</title>
 
4
    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
 
5
    <link rel="stylesheet" href="style.css" type="text/css" />
 
6
    <script src="../lib/Firebug/firebug.js"></script>
 
7
    <script src="../lib/OpenLayers.js"></script>
 
8
    <script type="text/javascript">
 
9
        var map = null;
 
10
        var extent = new OpenLayers.Bounds(-180, -90, 180, 90);
 
11
 
 
12
        function init() {
 
13
            var options = {
 
14
                restrictedExtent: extent
 
15
            }
 
16
            map = new OpenLayers.Map('map', options);
 
17
 
 
18
            var wms = new OpenLayers.Layer.WMS(
 
19
                "OpenLayers WMS", 
 
20
                "http://labs.metacarta.com/wms/vmap0?",
 
21
                {layers: 'basic'}
 
22
            ); 
 
23
 
 
24
            map.addLayers([wms]);
 
25
            map.setCenter(extent, 1);
 
26
            document.getElementById("toggle").checked = true;
 
27
        }
 
28
        
 
29
        function toggleRestrictedExtent() {
 
30
            if(map.restrictedExtent == null) {
 
31
                map.setOptions({restrictedExtent: extent});
 
32
            } else {
 
33
                map.setOptions({restrictedExtent: null});
 
34
            }
 
35
        }
 
36
    </script>
 
37
  </head>
 
38
  <body onload="init()">
 
39
    <h3 id="title">OpenLayers Restricted Extent Example</h3>
 
40
    <p id="shortdesc">
 
41
      Don't let users drag outside the map extent: instead, limit dragging such
 
42
      that the extent of the layer is the maximum viewable area.
 
43
    </p>
 
44
    <div id="map" class="smallmap"></div>
 
45
    <p>
 
46
        Map navigation is limited by a combination of map and layer properties.
 
47
        The base layer resolutions array controls the resolutions (or zoom
 
48
        levels) available.  The resolutions can be limited by setting a
 
49
        maxResolution property or by explicitly specifying a resolutions
 
50
        array.
 
51
    </p>
 
52
    <p>
 
53
        Navigation limited by the maxExtent property.  A map cannot be panned
 
54
        so that the center of the viewport is outside of the bounds specified
 
55
        in maxExtent.  If you wish to further restrict panning, use the
 
56
        restrictedExtent property.  With restrictedExtent set, the map cannot
 
57
        be panned beyond the given bounds.  If the maxResolution allows the
 
58
        map to be zoomed to a resolution that displays an area bigger than
 
59
        the restrictedExtent, the viewport will remain centered on the
 
60
        restrictedExtent.
 
61
    </p>
 
62
    <p>
 
63
        <input type="checkbox" id="toggle" checked="checked"
 
64
               onclick="toggleRestrictedExtent();" />
 
65
        <label for="toggle">
 
66
            Toggle restricted extent (to [-180, -90, 180, 90]).
 
67
        </label>
 
68
    
 
69
  </body>
 
70
</html>