[OpenLayers-Commits] r12173 - in trunk/openlayers/examples: .
tasmania
commits-20090109 at openlayers.org
commits-20090109 at openlayers.org
Tue Jul 19 06:09:59 EDT 2011
Author: ahocevar
Date: 2011-07-19 03:09:58 -0700 (Tue, 19 Jul 2011)
New Revision: 12173
Added:
trunk/openlayers/examples/sld.js
Modified:
trunk/openlayers/examples/sld.html
trunk/openlayers/examples/tasmania/sld-tasmania.xml
Log:
Simplified the sld example
Modified: trunk/openlayers/examples/sld.html
===================================================================
--- trunk/openlayers/examples/sld.html 2011-07-18 12:58:43 UTC (rev 12172)
+++ trunk/openlayers/examples/sld.html 2011-07-19 10:09:58 UTC (rev 12173)
@@ -6,92 +6,9 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
- <script src="../lib/Firebug/firebug.js"></script>
+ <!--script src="../lib/Firebug/firebug.js"></script-->
<script src="../lib/OpenLayers.js"></script>
- <script type="text/javascript">
-
- var map, sld, gmlLayers;
- var format = new OpenLayers.Format.SLD();
- function init() {
-
- map = new OpenLayers.Map('map');
- map.addControl(new OpenLayers.Control.LayerSwitcher());
-
- OpenLayers.loadURL("tasmania/sld-tasmania.xml", null, null, complete);
-
- }
-
- function getDefaultStyle(sld, layerName) {
- var styles = sld.namedLayers[layerName].userStyles;
- var style;
- for(var i=0; i<styles.length; ++i) {
- style = styles[i];
- if(style.isDefault) {
- break;
- }
- }
- return style;
- }
-
- function complete(req) {
-
- sld = format.read(req.responseXML || req.responseText);
- var hoverStyle = sld.namedLayers["WaterBodies"].userStyles[1];
- hoverStyle.defaultStyle = OpenLayers.Util.extend(
- {}, OpenLayers.Feature.Vector.style["select"]
- );
-
- gmlLayers = [
- // use the sld UserStyle named "Default Styler"
- new OpenLayers.Layer.GML(
- "StateBoundaries",
- "tasmania/TasmaniaStateBoundaries.xml",
- {
- styleMap: new OpenLayers.StyleMap(
- getDefaultStyle(sld, "Land")
- ),
- isBaseLayer: true
- }
- ),
- new OpenLayers.Layer.GML(
- "Roads",
- "tasmania/TasmaniaRoads.xml",
- {styleMap: new OpenLayers.StyleMap(getDefaultStyle(sld, "Roads"))}
- ),
- new OpenLayers.Layer.GML(
- "WaterBodies",
- "tasmania/TasmaniaWaterBodies.xml",
- {
- styleMap: new OpenLayers.StyleMap({
- "default": getDefaultStyle(sld, "WaterBodies"),
- "select": hoverStyle
- })
- }
- ),
- new OpenLayers.Layer.GML(
- "Cities",
- "tasmania/TasmaniaCities.xml",
- {styleMap: new OpenLayers.StyleMap(getDefaultStyle(sld, "Cities"))}
- )
- ];
-
- map.addLayers(gmlLayers);
- map.zoomToExtent(new OpenLayers.Bounds(143,-39,150,-45));
-
- var hover = new OpenLayers.Control.SelectFeature(
- gmlLayers[2], {hover: true}
- );
- map.addControl(hover);
- hover.activate();
- }
-
- // set a new style when the radio button changes
- function setStyle(index) {
- gmlLayers[2].styleMap.styles["default"] = sld.namedLayers["WaterBodies"].userStyles[index];
- // change the style of the features of the WaterBodies layer
- gmlLayers[2].redraw();
- }
- </script>
+ <script src="sld.js"></script>
</head>
<body onload="init()">
<h1 id="title">Styled Layer Descriptor (SLD) Example</h1>
@@ -105,19 +22,10 @@
<p id="docs">This example uses a <a target="_blank" href="tasmania/sld-tasmania.xml">SLD
file</a> to style the vector features. To construct layers that use styles
from SLD, create a StyleMap for the layer that uses one of the userStyles in the
- namedLayers object of the return from format.read().</p>
+ namedLayers object of the return from format.read(). Look at the <a href="sld.js">sld.js source</a>
+ to see how this is done.</p>
<p>Select a new style for the WaterBodies layer below:</p>
- <form>
- <input type="radio" name="style" onclick="setStyle(this.value)" checked="checked" value="0">Default Styler (zoom in to see more features)</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="3">Styler Test PropertyIsEqualTo</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="4">Styler Test WATER_TYPE</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="5">Styler Test PropertyIsGreaterThanOrEqualTo</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="6">Styler Test PropertyIsLessThanOrEqualTo</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="7">Styler Test PropertyIsGreaterThan</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="8">Styler Test PropertyIsLessThan</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="9">Styler Test PropertyIsLike</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="10">Styler Test PropertyIsBetween</input><br>
- <input type="radio" name="style" onclick="setStyle(this.value)" value="11">Styler Test FeatureId</input><br>
- </form>
+ <ul id="style_chooser">
+ </ul>
</body>
</html>
Added: trunk/openlayers/examples/sld.js
===================================================================
--- trunk/openlayers/examples/sld.js (rev 0)
+++ trunk/openlayers/examples/sld.js 2011-07-19 10:09:58 UTC (rev 12173)
@@ -0,0 +1,99 @@
+var map, sld, waterBodies;
+var format = new OpenLayers.Format.SLD();
+function init() {
+
+ map = new OpenLayers.Map('map', {allOverlays: true});
+ var layers = createLayers();
+ map.addLayers(layers);
+
+ waterBodies = layers[2];
+ map.addControl(new OpenLayers.Control.SelectFeature(
+ waterBodies, {hover: true, autoActivate: true}
+ ));
+ map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+ OpenLayers.loadURL("tasmania/sld-tasmania.xml", null, null, complete);
+}
+
+// handler for the loadURL function in the init method
+function complete(req) {
+ sld = format.read(req.responseXML || req.responseText);
+ buildStyleChooser();
+ setLayerStyles();
+
+ map.zoomToExtent(new OpenLayers.Bounds(143,-39,150,-45));
+}
+
+function createLayers() {
+ // the name of each layer matches a NamedLayer name in the SLD document
+ var layerData = [{
+ name: "Land",
+ url: "tasmania/TasmaniaStateBoundaries.xml"
+ }, {
+ name: "Roads",
+ url: "tasmania/TasmaniaRoads.xml"
+ }, {
+ name: "WaterBodies",
+ url: "tasmania/TasmaniaWaterBodies.xml"
+ }, {
+ name: "Cities",
+ url: "tasmania/TasmaniaCities.xml"
+ }];
+
+ var layers = [];
+ for (var i=0,ii=layerData.length; i<ii; ++i) {
+ layers.push(new OpenLayers.Layer.Vector(
+ layerData[i].name, {
+ protocol: new OpenLayers.Protocol.HTTP({
+ url: layerData[i].url,
+ format: new OpenLayers.Format.GML.v2()
+ }),
+ strategies: [new OpenLayers.Strategy.Fixed()],
+ // empty style map, will be populated in setLayerStyles
+ styleMap: new OpenLayers.StyleMap()
+ }
+ ));
+ }
+ return layers;
+}
+
+function setLayerStyles() {
+ // set the default style for each layer from sld
+ for (var l in sld.namedLayers) {
+ var styles = sld.namedLayers[l].userStyles, style;
+ for (var i=0,ii=styles.length; i<ii; ++i) {
+ style = styles[i];
+ if (style.isDefault) {
+ map.getLayersByName(l)[0].styleMap.styles["default"] = style;
+ break;
+ }
+ }
+ }
+ // select style for mouseover on WaterBodies objects
+ waterBodies.styleMap.styles.select = sld.namedLayers["WaterBodies"].userStyles[1];
+}
+
+// add a radio button for each userStyle
+function buildStyleChooser() {
+ var styles = sld.namedLayers["WaterBodies"].userStyles;
+ var chooser = document.getElementById("style_chooser"), input, li;
+ for (var i=0,ii=styles.length; i<ii; ++i) {
+ input = document.createElement("input");
+ input.type = "radio";
+ input.name = "style";
+ input.value = i;
+ input.checked = i == 0;
+ input.onclick = function() { setStyle(this.value); };
+ li = document.createElement("li");
+ li.appendChild(input);
+ li.appendChild(document.createTextNode(styles[i].title));
+ chooser.appendChild(li);
+ }
+}
+
+// set a new style when the radio button changes
+function setStyle(index) {
+ waterBodies.styleMap.styles["default"] = sld.namedLayers["WaterBodies"].userStyles[index];
+ // apply the new style of the features of the Water Bodies layer
+ waterBodies.redraw();
+}
Modified: trunk/openlayers/examples/tasmania/sld-tasmania.xml
===================================================================
--- trunk/openlayers/examples/tasmania/sld-tasmania.xml 2011-07-18 12:58:43 UTC (rev 12172)
+++ trunk/openlayers/examples/tasmania/sld-tasmania.xml 2011-07-19 10:09:58 UTC (rev 12173)
@@ -10,7 +10,7 @@
<sld:Name>WaterBodies</sld:Name>
<sld:UserStyle>
<sld:Name>Default Styler</sld:Name>
- <sld:Title>Default Styler</sld:Title>
+ <sld:Title>Default Styler (zoom in to see more objects)</sld:Title>
<sld:Abstract></sld:Abstract>
<sld:IsDefault>1</sld:IsDefault>
<sld:FeatureTypeStyle>
More information about the Commits
mailing list