How can I zoomed to the cql_filter feature?

user_9354344 0
Viewed 1136

I am using geoserver. I write the following code;

const mywms = L.tileLayer.wms("http://localhost:8080/geoserver/taj/wms", {
    layers: 'taj:country',
    format: 'image/png',
    CQL_FILTER: 'name=pana'
    transparent: true,
    opacity: 0.4,
    version: '1.1.0',
    attribution: "country layer"
});

All is good. The layer get filtered. But I need the selected feature to zoom full extend. I tried to center the mywms layer using this code; map.fitBounds(mywms.GetBounds());. But it shows the error; mywms.getBOunds is not a function. Any help?

wms leaflet geoserver
2 Answers

As is pointed out in the comments WMS requests contain the bounding box of the map in the request and so will always cover the whole of the map area.

To get the extent of a single feature you need to make a WFS request with the filter included and then zoom to the extent of that feature when it is returned.

user_4391940

Thank you very much for all of the helping hands. And special thanks to Mr. Ina Turton who helps me to find out the actual problem and get the solution. my url for the wfs server looks like this;

http://localhost:8080/geoserver/tajikistan/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=taj%3Acountry&maxFeatures=50&outputFormat=application%2Fjson

I write the following code to for zooming into my cql_filter area:

//Geoserver Web Feature Service
$.ajax('http://localhost:8080/geoserver/wfs',{
  type: 'GET',
  data: {
      service: 'WFS',
      version: '1.1.0',
      request: 'GetFeature',
      typename: 'tajikistan:country',
      CQL_FILTER: "name_rg='Centre'",
      srsname: 'EPSG:4326',
      outputFormat: 'text/javascript',
      },
  dataType: 'jsonp',
  jsonpCallback:'callback:handleJson',
  jsonp:'format_options'
  });


function handleJson(data) {
    var requiredArea = L.geoJson(data).addTo(map);
    map.fitBounds(requiredArea.getBounds())
}

In this code the CQL_FILTER is used for to filter out the required area. In my case the data having column name name_rg which have the property as Centre. I query this region using this code. I fetch the data using ajax method. I write the code little tricky because the regular ajax call doesn't callback the handleJson function and return an parseJson error. And finally I added the variable named as requiredArea. Get bounds of this region and set bounds of the required region and added into the map.

user_93543440
Related