Since you already setup the stylemaps for diplaying labels. You can easily do this by checking the feature attribute value of the required field with the search text
Try the below code to search in attributes
//JS code
function search() {
var search_name = document.getElementById("search_text").value;
var features = layer.features;
layer.destroyFeatures();
for(var i=0; i< features.length; i++) {
//features[i].attributes.name. you have the attribute field "name"
if(features[i].attributes.name === search_name) {
layer.addFeatures([features[i]])
}
}
layer.redraw();
}
<!-- HTML stuff -->
<input type="text" id="search_text" />
<button onclick="search()">Search</button>
Update:
hide/show using renderIntent
//JS code
function search() {
var search_name = document.getElementById("search_text").value;
var features = layer.features;
for(var i=0; i< features.length; i++) {
//features[i].attributes.name. you have the attribute field "name"
//hide a feature by default
features[i].renderIntent = "delete";
if(features[i].attributes.name === search_name) {
//show a feature value of name attribute is search_name
features[i].renderIntent = "default"
}
}
layer.redraw();
}
The second method becomes faster as renderIntent="delete"
will set the css property display: none;
(hiding) and renderIntent="default"
will use the default rendering from your stylemap obivously showing the features.
I will describe the way I dealed with the problem. As I mentioned before I have approximately 10000 geometries that I want to display on a map. My data are stored in a POSTGIS database and I use Geoserver (localserver) and Openlayers to display them.
Also I need to interact with the data. Get attribute info for each feature and in some cased to manipulate them.
I wrote two different scripts one using WMS layers and the other using WFS layers. I run some speed tests (for the requests) using Firebug and as expected the WFS request was taking much much more. So much more that is not acceptable for my app (see screenshots WFS/WMS )
After reading the above answers and comments I decided to do the following:
- I created WMS Layers for my data
- I registered a zoom event
- After the user reaching a predifined zoom level I send a WFS request with a BBOX strategy
This is my code. I hope it helps someone else with similar issue.
<script defer="defer" type="text/javascript">
<!-- DEFINE PROXY.CGI URL -->
OpenLayers.ProxyHost = "http://localhost/cgi-bin/proxy.cgi?url=";
<!-- DEFINE GLOBAL VARIABLES -->
var map,wms, control;
<!-- DEFINE FUNCTION INIT -->
function init(){
map = new OpenLayers.Map('map',{}); // define map
wms = new OpenLayers.Layer.WMS( "OpenLayers WMS","http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'} ); // define map layer
// layer nodes
wms_layer_komvoi = new OpenLayers.Layer.WMS( "Κόμβοι","http://localhost:8080/geoserver/wms",
{layers: 'rural:komvoi_real',
transparent: true},
{projection: new OpenLayers.Projection("EPSG:900913")});
// layer network
wms_layer_network = new OpenLayers.Layer.WMS( "Ολόκληρο Δίκτυο","http://localhost:8080/geoserver/wms",
{layers: 'rural:foc_network',
transparent: true},
{projection: new OpenLayers.Projection("EPSG:900913")},
{
});
// add layers
map.addLayers([wms_layer_komvoi,wms_layer_network,wms]); // first you put the layer with the points
map.zoomToExtent( new OpenLayers.Bounds(36.190737, 35.353912,35.150577, 50.274810));
<!-- CONTROL LAYER SWITCHER -->
map.addControl(new OpenLayers.Control.LayerSwitcher());
<!-- REGISTER AN EVENT TO LOAD WFS VECTOR LAYERS -->
map.events.register("zoomend", map, function(){ // event zoomend
zoom = map.getZoom();
var layerNetwork = map.getLayersByName('Δίκτυο'); // check if the layer exists
if((zoom==11) && (layerNetwork.length==0)){
<!-- OVERLAY WFS LAYER WITH NETWORK FROM GEOSERVER BBOX STRATEGY -->
wfs_layer_network = new OpenLayers.Layer.Vector("Δίκτυο", {
visibility: true,
//displayInLayerSwitcher: true,
strategies: [new OpenLayers.Strategy.BBOX()],
protocol: new OpenLayers.Protocol.WFS({
version: "1.1.0",
url: "http://localhost:8080/geoserver/wfs",
featurePrefix: "rural", //workspace from geoserver
featureType: "foc_network", //layer name from geoserver
featureNS : "http://www.opengeospatial.net/rural", //namespace from geoserver
})
})
map.removeLayer(wms_layer_network);
map.addLayer(wfs_layer_network);
}
if ((zoom<11) && (layerNetwork.length!==0)){
map.removeLayer(wfs_layer_network);
map.addLayer(wms_layer_network);
}
});
}// end init
</script>
Best Answer
How were the features loaded in the layer in the first place?
Unless the features were added on the client (i.e. in a Javascript function written by you), when the extent changes the default behavior for Vector layers backed by WFS is to fetch new features from the server.
You can customize the behavior of the Vector layer with regard to remote sources by providing a properly configured strategy. Examples like this one are available in the examples page.