1 <html xmlns="http://www.w3.org/1999/xhtml">
3 <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
4 <link rel="stylesheet" href="style.css" type="text/css" />
5 <title>WFS: GetFeature Example (GeoServer)</title>
6 <script src="../lib/OpenLayers.js"></script>
7 <script type="text/javascript">
8 var map, layer, select, hover, control;
11 OpenLayers.ProxyHost= "proxy.cgi?url=";
12 map = new OpenLayers.Map('map', {
14 new OpenLayers.Control.PanZoom(),
15 new OpenLayers.Control.Permalink(),
16 new OpenLayers.Control.Navigation()
19 layer = new OpenLayers.Layer.WMS(
21 "http://demo.opengeo.org/geoserver/ows",
22 {layers: 'topp:states', format: 'image/gif'}
24 select = new OpenLayers.Layer.Vector("Selection", {styleMap:
25 new OpenLayers.Style(OpenLayers.Feature.Vector.style["select"])
27 hover = new OpenLayers.Layer.Vector("Hover");
28 map.addLayers([layer, hover, select]);
30 control = new OpenLayers.Control.GetFeature({
31 protocol: OpenLayers.Protocol.WFS.fromWMSLayer(layer),
34 multipleKey: "shiftKey",
37 control.events.register("featureselected", this, function(e) {
38 select.addFeatures([e.feature]);
40 control.events.register("featureunselected", this, function(e) {
41 select.removeFeatures([e.feature]);
43 control.events.register("hoverfeature", this, function(e) {
44 hover.addFeatures([e.feature]);
46 control.events.register("outfeature", this, function(e) {
47 hover.removeFeatures([e.feature]);
49 map.addControl(control);
52 map.setCenter(new OpenLayers.Bounds(-140.444336,25.115234,-44.438477,50.580078).getCenterLonLat(), 3);
56 <body onload="init()">
57 <h1 id="title">WFS GetFeature Example (GeoServer)</h1>
63 Shows how to use the GetFeature control to select features from a
64 WMS layer. Click or drag a box to select features, use the Shift key to
65 add features to the selection, use the Ctrl key to toggle a feature's
66 selected status. Note that this control also has a hover option, which is
67 enabled in this example. This gives you a visual feedback by loading the
68 feature underneath the mouse pointer from the WFS, but causes a lot of
69 GetFeature requests to be issued.
72 <div id="map" class="smallmap"></div>