← Back to branch summary

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

« back to all changes in this revision

Viewing changes to gis/dhis-gis-geostat/mfbase/openlayers/tests/manual/vector-layer-zindex.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:
gis/dhis-gis-geostat/mfbase/openlayers/tests/manual/vector-layer-zindex.html
 
1
<html xmlns="http://www.w3.org/1999/xhtml">
 
2
  <head>
 
3
    <title>Vector Layer ZIndex Test</title>
 
4
    <style type="text/css">
 
5
        body {
 
6
            font-size: 0.8em;
 
7
        }
 
8
        p {
 
9
            padding-top: 1em;
 
10
        }
 
11
        #map {
 
12
            margin: 1em;
 
13
            width: 512px;
 
14
            height: 512px;
 
15
        }
 
16
    </style>
 
17
 
 
18
    <script src="../../lib/OpenLayers.js"></script>
 
19
    <script type="text/javascript">
 
20
        var map, layerA, layerB, layerV, selectControl1, selectControl2;
 
21
 
 
22
        function init() {
 
23
            map = new OpenLayers.Map('map');
 
24
            var wmsLayer = new OpenLayers.Layer.WMS(
 
25
                "OpenLayers WMS", 
 
26
                "http://labs.metacarta.com/wms/vmap0",
 
27
                {layers: 'basic'}
 
28
            );
 
29
 
 
30
            layerV = new OpenLayers.Layer.Vector('v');
 
31
            var feature = new OpenLayers.Feature.Vector(
 
32
                new OpenLayers.Geometry.Polygon([
 
33
                    new OpenLayers.Geometry.LinearRing([
 
34
                        new OpenLayers.Geometry.Point(-110, 60),
 
35
                        new OpenLayers.Geometry.Point(-110, 30),
 
36
                        new OpenLayers.Geometry.Point(-80, 30),
 
37
                        new OpenLayers.Geometry.Point(-110, 60)
 
38
                    ])
 
39
                ])
 
40
            );
 
41
            layerV.addFeatures([feature]);
 
42
            selectControl1 = new OpenLayers.Control.SelectFeature(layerV);
 
43
            selectControl2 = new OpenLayers.Control.SelectFeature(layerV, {
 
44
                hover: true,
 
45
                selectStyle: OpenLayers.Util.applyDefaults({fillColor: "red"}, OpenLayers.Feature.Vector.style["select"]),
 
46
                onSelect: function(feature) {
 
47
                    selectControl2.unselect(feature);
 
48
                    layerV.drawFeature(feature, selectControl2.selectStyle);
 
49
                }
 
50
            });
 
51
            selectControl2.events.register("beforefeatureselected", null, function(feature) {
 
52
                layerV.drawFeature(feature, selectControl2.selectStyle);
 
53
                return false;
 
54
            })
 
55
 
 
56
            layerA = new OpenLayers.Layer('a', {'isBaseLayer': false});
 
57
            layerB = new OpenLayers.Layer.WMS(
 
58
                'b', 'http://www2.dmsolutions.ca/cgi-bin/mswms_gmap', {
 
59
                    'layers': [
 
60
                        'bathymetry', 'land_fn', 'park', 'drain_fn', 'drainage',
 
61
                        'prov_bound', 'fedlimit', 'rail', 'road', 'popplace'
 
62
                    ],
 
63
                    'transparent': 'true',
 
64
                    'format': 'image/png'
 
65
                }, {
 
66
                    'reproject': false
 
67
            });
 
68
 
 
69
            map.addLayers([wmsLayer, layerV, layerA, layerB]);
 
70
            map.addControl(selectControl2);
 
71
            map.addControl(selectControl1);
 
72
            map.addControl(new OpenLayers.Control.MousePosition());
 
73
            selectControl2.activate();
 
74
            selectControl1.activate();
 
75
 
 
76
            map.setCenter(new OpenLayers.LonLat(-90, 20), 2);
 
77
        }
 
78
 
 
79
        function removeLayerA() {
 
80
            if (OpenLayers.Util.indexOf(map.layers, layerA) > -1) {
 
81
                map.removeLayer(layerA);
 
82
            }
 
83
        }
 
84
        
 
85
        function toggleSelectControl1() {
 
86
            if (selectControl1.active) {
 
87
                selectControl1.deactivate();
 
88
                alert("SelectFeature control for clicks deactivated.");
 
89
            } else {
 
90
                selectControl1.activate();
 
91
                alert("SelectFeature control for clicks activated.");
 
92
            }
 
93
        }
 
94
 
 
95
        function toggleSelectControl2() {
 
96
            if (selectControl2.active) {
 
97
                selectControl2.deactivate();
 
98
                alert("SelectFeature control for hover deactivated.");
 
99
            } else {
 
100
                selectControl2.activate();
 
101
                alert("SelectFeature control for hover activated.");
 
102
            }
 
103
        }
 
104
    </script>
 
105
  </head>
 
106
  <body onload="init()">
 
107
    <h1 id="title">Vector Layer ZIndex Test</h1>
 
108
    <div id="map"></div>
 
109
    <p>
 
110
 
 
111
    The map includes one base layer (vmap0) and three overlays, namely a vector
 
112
    layer, a fake layer with no images, and a dmsolutions layer. The overlays are
 
113
    added to the map in this order: the vector layer, the fake layer, and the
 
114
    dmsolutions layer. The map also includes a select feature control, which
 
115
    when activated bumped the vector layer z-index to some high value. This
 
116
    makes feature selection work, even though other overlays were added after
 
117
    the vector layer.
 
118
       
 
119
    </p>
 
120
    <p>
 
121
 
 
122
    If the fake layer is removed from the map (first link below), the vector layer's
 
123
    z-index must not be reset, so the vector layer must not go under the
 
124
    dmsolutions layer and feature selection must continue to function as
 
125
    expected.
 
126
       
 
127
    </p>
 
128
    <p>
 
129
 
 
130
    If one of the SelectFeature controls is deactivated or activated (second
 
131
    and third link below), the vector layer should change it's position in the
 
132
    layer stack: on top if at least one of the controls is activated, covered
 
133
    by other layers if both are deactivated.
 
134
 
 
135
    </p>
 
136
 
 
137
    <p>
 
138
      <a href="javascript:removeLayerA()">Remove the fake layer</a>
 
139
      <br/><a href="javascript:toggleSelectControl1()">Toggle the click SelectFeature control's active status</a>
 
140
      <br/><a href="javascript:toggleSelectControl2()">Toggle the hover SelectFeature control's active status</a>
 
141
    </p>
 
142
  </body>
 
143
</html>