Leaflet Search для GeoJSON с созданием дублирующих кнопок - PullRequest
0 голосов
/ 07 ноября 2019

Приведенный ниже код отлично работает для добавления на листовую карту. Кроме того, окно поиска работает хорошо, и поиск выполняется в data.problem - это поиск, который добавляется несколько раз, если я выбрал «Baswari» из выпадающего списка, поле поиска добавлялось для Baswari, также, если я выбрал «Bagjiwala», также добавлялось окно поиска для Bagjiwala. означает, что окно поиска добавляется несколько раз. Error image

function wmslayers(gwc){
  var quoteText = {};
  var gwc = {};
  var url_geoserver = {};
        var location = document.getElementsByName("myInput")[0]
        var gwc  = location.options[location.selectedIndex].value;
        var layername = location.options[location.selectedIndex].text;
        var url_geoserver = "http://localhost/geoserver/wms"

        if (gwc == 2913)
        {
         var url =  L.tileLayer.wms(url_geoserver,{
                  layers: 'apib_cadastral:bagjiwala_final',
                  format: 'image/png',
                  version: '1.1.0',
                  transparent: true,
                  maxZoom: 28
        })      }
      else if (gwc == 2912)
      {
        var url = L.tileLayer.wms(url_geoserver,{
          layers: 'apib_cadastral:baswari_564',
          format: 'image/png',
          version: '1.1.0',
          transparent: true,
          maxZoom: 28
        })      }
var te = JSON.stringify(url)
var myjson_p = JSON.parse(te)
var final = myjson_p["options"]["layers"]
var quoteText = `${final}`
/*End_Lohaghat*/
map.addLayer(url);
layerControl.addOverlay(url,layername)


/*Search*/
var owsrootUrl ='http://localhost/geoserver/apib_cadastral/ows';
var defaultParameters = {
            service: 'WFS',
            version: '1.0.0',
            request: 'GetFeature',
            typeName: quoteText ,
            outputFormat: 'application/json',
            format_options: 'callback:getJson'
};
var callbackstring=defaultParameters.format_options;
var cbstring=callbackstring.slice(9,27);
var parametres = L.Util.extend(defaultParameters);
var URL = owsrootUrl + L.Util.getParamString(parametres);
var ur_geojson = new L.GeoJSON(0,{})
function loadGeoJson(data) {
ur_geojson.addData(data);
};
$.ajax({ 
    url: URL,
    dataType : 'json',
    jsonpCallback: 'loadGeoJson',
    success: loadGeoJson,
    })

var searchControl = new L.Control.Search({
    layer: ur_geojson,
    propertyName: 'survey_no',
    marker: false,
    moveToLocation: function(latlng, title, map) {
      //map.fitBounds( latlng.layer.getBounds() );
      var zoom = map.getBoundsZoom(latlng.layer.getBounds());
        map.setView(latlng, zoom); // access the zoom
    }
  });

  searchControl.on('search:locationfound', function(e) {

    //console.log('search:locationfound', );

  /*map.removeLayer(this._markerSearch)*/

    e.layer.setStyle({fillColor: '#3f0', color: '#0f0'});
    if(e.layer._popup)
      e.layer.openPopup();

  }).on('search:collapsed', function(e) {

    ur_geojson.eachLayer(function(layer) { //restore feature color
      ur_geojson.resetStyle(layer);
    }); 
  });

  map.addControl( searchControl );  //inizialize search control

/*End_Search*/
}

Здесь html

<select  name="myInput" id="choice1" onchange="wmslayers(this);">
        <option value="" disabled selected>Please select </option></li>
     <!-- Pati -->
        <li><option value="2912">Baswari</option></li>
        <li><option value="2913">Bagjiwala</option></li>
</select>
...