Openlayers:从WFS层搜索

时间:2016-01-29 14:53:12

标签: javascript filter openlayers

我正在使用Geoserver / PostGIS / openLayers

我已成功设置了矢量图层。现在我正在尝试创建搜索功能。但出了点问题。

这是我的代码



<form>

<input id="sub01" type="submit" value="Search" onclick="changeFilter()">
</form>


	


<script type="text/javascript">
        OpenLayers.ProxyHost = "/cgi-bin/proxy.cgi?url="; 
	
	var renderer = OpenLayers.Util.getParameters(window.location.href).renderer;
renderer = (renderer) ? [renderer] : OpenLayers.Layer.Vector.prototype.renderers;
	
var WGS84 = new OpenLayers.Projection("EPSG:4326"); 
var mercator = new OpenLayers.Projection("EPSG:900913"); 

var map = new OpenLayers.Map ("dMap", {    

controls:[
],
maxResolution: 0.005,
displayProjection: WGS84,
 units: 'degrees'
} );


var wfs = new OpenLayers.Layer.Vector("Editable Features", {
renderers: renderer,
  displayInLayerSwitcher: true,
strategies: [
new OpenLayers.Strategy.Fixed(),
new OpenLayers.Strategy.Cluster({distance:
15})
],

 styleMap: new OpenLayers.StyleMap(style),

protocol: new OpenLayers.Protocol.WFS({
version: "1.1.0",
url: "http://localhost:8080/geoserver/wfs",
featureNS :  "http://www.openplans.org/tour",
srsName: "EPSG:4326",
featureType: "tourism",
geometryName: "the_geom"
}),
extractStyles: true,
strategies: [new OpenLayers.Strategy.BBOX()],
filter: new OpenLayers.Filter.Logical({
type: OpenLayers.Filter.Logical.AND,
filters: [
new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.
Comparison.EQUAL_TO,
property: prop1,
value: testfil
}),
new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.
Comparison.EQUAL_TO,
property: prop2,
value: testfil2
})
]
})

});
var prop1 = "tourismtype";
var testfil = "Recreation";
var prop2 = "tourismname";
var testfil2 = "Park";
function changeFilter(prop1, prop2, testfil, testfil2){
wfs.destroyFeatures();
filter: new OpenLayers.Filter.Logical({
type: OpenLayers.Filter.Logical.AND,
filters: [
new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.Comparison.EQUAL_TO,
property: prop1,
value: testfil
}),
new OpenLayers.Filter.Comparison({
type: OpenLayers.Filter.Comparison.EQUAL_TO,
property: prop2,
value: testfil2
})
]
})
wfs.filter = filter;
    wfs.refresh({force: true});
}

		
    </script>
&#13;
&#13;
&#13;

这不行。我已经尝试过编辑我的代码,我不知道该怎么做,我已经找到了答案,没有什么能真正帮助我。请指教......

感谢。

1 个答案:

答案 0 :(得分:0)

我的问题解决了,我把输入元素的类型提交到表单元素之外。有用。 我的初始代码是:

  <form>
Other code
<input id="sub01" type="submit" value="Search" onclick="changeFilter()">
</form>

My Correction cod是:

 <form>
Other code
</form>
 <input id="sub01" type="submit" value="Search" onclick="changeFilter()">