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

« back to all changes in this revision

Viewing changes to gis/dhis-gis-geostat/mfbase/openlayers/examples/sld.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
    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
 
4
    <link rel="stylesheet" href="style.css" type="text/css" />
 
5
    <script src="../lib/Firebug/firebug.js"></script>
 
6
    <script src="../lib/OpenLayers.js"></script>
 
7
    <script type="text/javascript">
 
8
        
 
9
        var map, sld, gmlLayers;
 
10
        var format = new OpenLayers.Format.SLD();
 
11
        function init() {
 
12
 
 
13
            map = new OpenLayers.Map('map');
 
14
            map.addControl(new OpenLayers.Control.LayerSwitcher());
 
15
 
 
16
            OpenLayers.loadURL("tasmania/sld-tasmania.xml", null, null, complete);
 
17
 
 
18
        }
 
19
        
 
20
        function getDefaultStyle(sld, layerName) {
 
21
            var styles = sld.namedLayers[layerName].userStyles;
 
22
            var style;
 
23
            for(var i=0; i<styles.length; ++i) {
 
24
                style = styles[i];
 
25
                if(style.isDefault) {
 
26
                    break;
 
27
                }
 
28
            }
 
29
            return style;
 
30
        }
 
31
 
 
32
        function complete(req) {
 
33
 
 
34
            sld = format.read(req.responseXML || req.responseText);
 
35
            var hoverStyle = sld.namedLayers["WaterBodies"].userStyles[1];
 
36
            hoverStyle.defaultStyle = OpenLayers.Util.extend(
 
37
                {}, OpenLayers.Feature.Vector.style["select"]
 
38
            );
 
39
 
 
40
            gmlLayers = [
 
41
                // use the sld UserStyle named "Default Styler"
 
42
                new OpenLayers.Layer.GML(
 
43
                    "StateBoundaries",
 
44
                    "tasmania/TasmaniaStateBoundaries.xml",
 
45
                    {
 
46
                        styleMap: new OpenLayers.StyleMap(
 
47
                            getDefaultStyle(sld, "Land")
 
48
                        ),
 
49
                        isBaseLayer: true
 
50
                    }
 
51
                ),
 
52
                new OpenLayers.Layer.GML(
 
53
                    "Roads",
 
54
                    "tasmania/TasmaniaRoads.xml",
 
55
                    {styleMap: new OpenLayers.StyleMap(getDefaultStyle(sld, "Roads"))}
 
56
                ),
 
57
                new OpenLayers.Layer.GML(
 
58
                    "WaterBodies",
 
59
                    "tasmania/TasmaniaWaterBodies.xml",
 
60
                    {
 
61
                        styleMap: new OpenLayers.StyleMap({
 
62
                            "default": getDefaultStyle(sld, "WaterBodies"),
 
63
                            "select": hoverStyle
 
64
                        })
 
65
                    }
 
66
                ),
 
67
                new OpenLayers.Layer.GML(
 
68
                    "Cities",
 
69
                    "tasmania/TasmaniaCities.xml",
 
70
                    {styleMap: new OpenLayers.StyleMap(getDefaultStyle(sld, "Cities"))}
 
71
                )
 
72
            ];
 
73
            
 
74
            map.addLayers(gmlLayers);
 
75
            map.zoomToExtent(new OpenLayers.Bounds(143,-39,150,-45));
 
76
            
 
77
            var hover = new OpenLayers.Control.SelectFeature(
 
78
                gmlLayers[2], {hover: true}
 
79
            );
 
80
            map.addControl(hover);
 
81
            hover.activate();
 
82
        }
 
83
        
 
84
        // set a new style when the radio button changes
 
85
        function setStyle(index) {
 
86
            gmlLayers[2].styleMap.styles["default"] = sld.namedLayers["WaterBodies"].userStyles[index];
 
87
            // change the style of the features of the WaterBodies layer
 
88
            gmlLayers[2].redraw();
 
89
        }
 
90
    </script>
 
91
  </head>
 
92
  <body onload="init()">
 
93
    <h1 id="title">Styled Layer Descriptor (SLD) Example</h1>
 
94
    <p id="shortdesc">
 
95
        Parsing SLD and applying styles to a vector layer.
 
96
    </p>
 
97
    <div id="map" class="smallmap"></div>
 
98
    <p id="docs">This example uses a <a target="_blank" href="tasmania/sld-tasmania.xml">SLD
 
99
    file</a> to style the vector features. To construct layers that use styles
 
100
    from SLD, create a StyleMap for the layer that uses one of the userStyles in the
 
101
    namedLayers object of the return from format.read().</p>
 
102
    <p>Select a new style for the WaterBodies layer below:</p>
 
103
    <form>
 
104
      <input type="radio" name="style" onclick="setStyle(this.value)" checked="checked" value="0">Default Styler (zoom in to see more features)</input><br/>
 
105
      <input type="radio" name="style" onclick="setStyle(this.value)" value="3">Styler Test PropertyIsEqualTo</input><br/>
 
106
      <input type="radio" name="style" onclick="setStyle(this.value)" value="4">Styler Test WATER_TYPE</input><br/>
 
107
      <input type="radio" name="style" onclick="setStyle(this.value)" value="5">Styler Test PropertyIsGreaterThanOrEqualTo</input><br/>
 
108
      <input type="radio" name="style" onclick="setStyle(this.value)" value="6">Styler Test PropertyIsLessThanOrEqualTo</input><br/>
 
109
      <input type="radio" name="style" onclick="setStyle(this.value)" value="7">Styler Test PropertyIsGreaterThan</input><br/>
 
110
      <input type="radio" name="style" onclick="setStyle(this.value)" value="8">Styler Test PropertyIsLessThan</input><br/>
 
111
      <input type="radio" name="style" onclick="setStyle(this.value)" value="9">Styler Test PropertyIsLike</input><br/>
 
112
      <input type="radio" name="style" onclick="setStyle(this.value)" value="10">Styler Test PropertyIsBetween</input><br/>
 
113
      <input type="radio" name="style" onclick="setStyle(this.value)" value="11">Styler Test FeatureId</input><br/>
 
114
    </form>
 
115
  </body>
 
116
</html>