OpenLayers WFS指定地理范围查询

1. 拖动矩形框查询

var gemetry;

  // 添加dragbox控件
     boxcontrol = new OpenLayers.Control();
      OpenLayers.Util.extend(boxcontrol, {
      draw: function () {
      box = new OpenLayers.Handler.Box( boxcontrol,
      {"done": this.notice});
       document.getElementById("dragpolygon").onclick= function(){
      if(document.getElementById("dragpolygon").checked){
      box.activate()
      }else{
      box.deactivate()
      };
      }
      },
    notice: function (bounds) {
    var ll = map.getLonLatFromPixel(new OpenLayers.Pixel(bounds.left, bounds.bottom)); 
          var ur = map.getLonLatFromPixel(new OpenLayers.Pixel(bounds.right, bounds.top));   
     boxgemetry=new OpenLayers.Bounds(ll.lon.toFixed(4), ll.lat.toFixed(4),
                                       ur.lon.toFixed(4),ur.lat.toFixed(4));
                 }
    });
    map.addControl(boxcontrol);

2.  多边形查询

//添加drawpolygon控件
    document.getElementById("polygon").onclick=function(){
                if(document.getElementById("polygon").checked){
     control.activate();
     map.addLayer(polygonLayer); 
    }else{
     control.deactivate();
     polygonLayer.removeAllFeatures();
    }
                 }; 

3. 查询函数

function query(){

str= text.value;//获得输入框地名点

 

if(polygonLayer.features[0]!=null){
     gemetry = polygonLayer.features[0].geometry;
     }else if(boxgemetry!=null){
         gemetry = boxgemetry;
        }else{
     gemetry = new OpenLayers.Bounds(-180,-90,180,90);
     }
    var filter = new OpenLayers.Filter.Logical({
    type: OpenLayers.Filter.Logical.AND,
    filters: [
    new OpenLayers.Filter.Spatial({
     type: OpenLayers.Filter.Spatial.INTERSECTS, //INTERSECTS, //相交OK
     value: gemetry,
     projection: "EPSG:4326"
    }),
     new OpenLayers.Filter.Comparison({//比较操作符
     type: OpenLayers.Filter.Comparison.LIKE, //模糊查询（通配符：*/#/!），速度很慢
     property: "cite:TDZL",
     value: "*"+str+"*"
     })]
    });
    var filter_1_0 = new OpenLayers.Format.Filter.v1_0_0();
   var xml = new OpenLayers.Format.XML();
   var xmlPara = "<?xml version='1.0' encoding='UTF-8'?>"
    + "<wfs:GetFeature service='WFS' version='1.0.0' "
    + "xmlns:wfs='http://www.opengis.net/wfs' "
    + "xmlns:gml='http://www.opengis.net/gml' "
    + "xmlns:ogc='http://www.opengis.net/ogc' "
    + "xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' "
    + "xsi:schemaLocation='http://www.opengis.net/wfs http://schemas.opengis.net/wfs/1.0.0/wfs.xsd'>"
    + "<wfs:Query typeName='cite:tz_zd_WGS84' srsName='EPSG:4326'>"
    + xml.write(filter_1_0.write(filter))
                + "</wfs:Query>"
    + "</wfs:GetFeature>";

   var request = OpenLayers.Request.POST( {
     url : "http://localhost:8080/geoserver/wfs?",
     data : xmlPara,   
     callback : handler
    });
    
   }
   function handler(req){
   var xmlDoc = req.responseXML;
   str= text.value;
   theNodes = xmlDoc.getElementsByTagName("cite:TDZL");
   area = xmlDoc.getElementsByTagName("cite:SHAPE_Area");
   QLR = xmlDoc.getElementsByTagName("cite:QLR");
   BZ = xmlDoc.getElementsByTagName("cite:BZ");
   coordinates = xmlDoc.getElementsByTagName("gml:coordinates");
   fid = xmlDoc.getElementsByTagName("cite:tz_zd_WGS84");
   if(theNodes[0]==null){alert("未查到信息")} 
     for (i=0;i < theNodes.length; i++ ){ 
     var fullName=theNodes[i].childNodes[0].nodeValue;
     var result;
     if (fullName.indexOf(str) > -1 ){    
         result ="<br>"
      result += "<ul><li><b>公司名: <\/b>"+QLR[i].childNodes[0].nodeValue+"<\/li><\/ul>"
         result +="<ul><li><b>地名: <\/b>"+theNodes[i].childNodes[0].nodeValue+"<\/li><\/ul>"
      result +="<ul><li><b>用地类型: <\/b>"+BZ[i].childNodes[0].nodeValue+"<\/li><\/ul>"
      result +="<ul><li><b>面积: <\/b>"+area[i].childNodes[0].nodeValue+"<\/li><\/ul>";

      var coordinate = coordinates[0].childNodes[0].nodeValue.split(" ");
      var tc = coordinate[0].split(",");
      var lon = tc[0];  var lat = tc[1];
      map.setCenter(new OpenLayers.LonLat(lon,lat),15);
      var x = fid[i].attributes;
      selectArea = new OpenLayers.Layer.GML("GML","http://localhost:8080/geoserver/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=cite:tz_zd_WGS84&featureid=" +x.getNamedItem("fid").nodeValue);
         map.addLayer(selectArea);   
     }
     document.getElementById("result").innerHTML =result;
    }
      }

}

 

4. 结论

  其实，就是用到了filter里的空间与点相交的函数，用来判断矩形、多边形等面内是否有相对应的地名点，如果有就返回地名点信息，没有就返回查询结果。