Adding example demonstrating the use of a spatial filter with the WFS protocol.

git-svn-id: http://svn.openlayers.org/trunk/openlayers@12087 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
2011-06-15 20:55:08 +00:00
parent cbac5db29a
commit a5f0b300f8
2 changed files with 73 additions and 0 deletions
--- a/examples/wfs-spatial-filter.html
+++ b/examples/wfs-spatial-filter.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+    <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+        <title>OpenLayers WFS Protocol with Filter</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css">
+        <link rel="stylesheet" href="style.css" type="text/css">
+        <script src="../lib/OpenLayers.js"></script>
+    </head>
+    <body>
+        <h1 id="title">WFS Protocol and Filter</h1>
+        <div id="tags">
+            filter, wfs, spatial
+        </div>
+        <p id="shortdesc">
+            Demonstrates the use of a spatial filter in making GetFeature requests using the WFS protocol.
+        </p>
+        <div id="map" class="smallmap"></div>
+        <div id="docs">
+            <p>
+                If a vector layer has a filter and the protocol supports server-side filtering,
+                the filter will be serialized in requests for features.  The WFS protocol can be
+                used with a vector layer to serialize a filter using OGC Filter Encoding.
+            </p><p>
+                This example has a draw control that is always active.  When you draw a polygon
+                on the map, the filter for the main vector layer will be updated, and features
+                that intersect your drawn polygon will be requested.
+            </p><p>
+                See the <a href="wfs-spatial-filter.js" target="_blank">source</a> 
+                for details on how this is done.
+            </p>
+        </div>
+        <script src="wfs-spatial-filter.js"></script>
+    </body>
+</html>
--- a/examples/wfs-spatial-filter.js
+++ b/examples/wfs-spatial-filter.js
@@ -0,0 +1,36 @@
+OpenLayers.ProxyHost= "/proxy?url=";
+var map = new OpenLayers.Map('map');
+var wms = new OpenLayers.Layer.WMS(
+    "OpenLayers WMS", "http://vmap0.tiles.osgeo.org/wms/vmap0",
+    {layers: "basic"}
+);
+
+var layer = new OpenLayers.Layer.Vector("WFS", {
+    strategies: [new OpenLayers.Strategy.BBOX()],
+    protocol: new OpenLayers.Protocol.WFS({
+        url:  "http://demo.opengeo.org/geoserver/wfs",
+        featureType: "tasmania_roads",
+        featureNS: "http://www.openplans.org/topp"
+    })
+});
+
+map.addLayers([wms, layer]);
+map.setCenter(new OpenLayers.LonLat(146.7, -41.8), 6);
+
+var drawings = new OpenLayers.Layer.Vector();
+map.addLayer(drawings);
+var draw = new OpenLayers.Control.DrawFeature(drawings, OpenLayers.Handler.Polygon);
+map.addControl(draw);
+draw.activate();
+
+drawings.events.on({
+    beforefeatureadded: function(event) {
+        var geometry = event.feature.geometry;
+        layer.filter = new OpenLayers.Filter.Spatial({
+            type: OpenLayers.Filter.Spatial.INTERSECTS,
+            value: event.feature.geometry
+        });
+        layer.refresh({force: true});
+        return false;
+    }
+});