Files
openlayers/examples/getfeature-wfs.html
ahocevar 612e95793c Added GetFeature control to get features based on spatial filters
created by clicking or dragging boxes on the map. Thanks tschaub for the 
review and the final patch with valuable improvements. r=tschaub
(closes #1936)


git-svn-id: http://svn.openlayers.org/trunk/openlayers@9003 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
2009-03-10 23:31:53 +00:00

81 lines
2.9 KiB
HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<title>WFS: GetFeature Example (GeoServer)</title>
<script src="../lib/OpenLayers.js"></script>
<script type="text/javascript">
var map, layer, select, hover, control;
function init(){
OpenLayers.ProxyHost= "proxy.cgi?url=";
map = new OpenLayers.Map('map', {
controls: [
new OpenLayers.Control.PanZoom(),
new OpenLayers.Control.Permalink(),
new OpenLayers.Control.Navigation()
]
});
layer = new OpenLayers.Layer.WMS(
"States WMS/WFS",
"http://demo.opengeo.org/geoserver/ows",
{layers: 'topp:states', format: 'image/gif'}
);
select = new OpenLayers.Layer.Vector("Selection", {styleMap:
new OpenLayers.Style(OpenLayers.Feature.Vector.style["select"])
});
hover = new OpenLayers.Layer.Vector("Hover");
map.addLayers([layer, hover, select]);
control = new OpenLayers.Control.GetFeature({
protocol: OpenLayers.Protocol.WFS.fromWMSLayer(layer),
box: true,
hover: true,
multipleKey: "shiftKey",
toggleKey: "ctrlKey"
});
control.events.register("featureselected", this, function(e) {
select.addFeatures([e.feature]);
});
control.events.register("featureunselected", this, function(e) {
select.removeFeatures([e.feature]);
});
control.events.register("hoverfeature", this, function(e) {
hover.addFeatures([e.feature]);
});
control.events.register("outfeature", this, function(e) {
hover.removeFeatures([e.feature]);
});
map.addControl(control);
control.activate();
map.setCenter(new OpenLayers.Bounds(-140.444336,25.115234,-44.438477,50.580078).getCenterLonLat(), 3);
}
</script>
</head>
<body onload="init()">
<h1 id="title">WFS GetFeature Example (GeoServer)</h1>
<div id="tags">
</div>
<p id="shortdesc">
Shows how to use the GetFeature control to select features from a
WMS layer. Click or drag a box to select features, use the Shift key to
add features to the selection, use the Ctrl key to toggle a feature's
selected status. Note that this control also has a hover option, which is
enabled in this example. This gives you a visual feedback by loading the
feature underneath the mouse pointer from the WFS, but causes a lot of
GetFeature requests to be issued.
</p>
<div id="map" class="smallmap"></div>
<div id="docs"></div>
</body>
</html>
</div>