2014-01-29 22 views
2

Ну, я пытаюсь объединить 2 примера для поиска из моего файла geojson, и при его выборе он увеличит это свойство.Поиск и масштабирование листовки geojson

  1. Поиск (поиск в GeoJSON один) http://labs.easyblog.it/maps/leaflet-search/examples/

  2. Увеличить часть здесь (без выпадающего меню) http://projects.bryanmcbride.com/leaflet/select_zoom.html

В основном первый один раз с увеличением от второго. Я смог заставить их работать, но отдельно.

коды (1)

var featuresLayer = new L.GeoJSON(piirid, { 
     style: function(f) { 
      return {color: f.properties.color }; 
     } 
    }); 

map.addLayer(featuresLayer); 

var searchControl = new L.Control.Search({layer: featuresLayer, propertyName: 'L_AADRESS', circleLocation:false}); 

searchControl.on('search_locationfound', function(e) { 


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


}).on('search_collapsed', function(e) { 

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

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

Код 2.

// Loop through the geojson features and extract bbox and name, then add the options to the "zoom" select (no jQuery) 
     /*var select = document.getElementById("zoom"); 
     select.options[select.options.length] = new Option('Select a State', 'Select a State'); 
     for (each in geojson._layers) { 
      var bbox = geojson._layers[each].getBounds()._southWest.lat + "," + geojson._layers[each].getBounds()._southWest.lng + "," + geojson._layers[each].getBounds()._northEast.lat + "," + geojson._layers[each].getBounds()._northEast.lng; 
      select.options[select.options.length] = new Option(geojson._layers[each].feature.properties.name, bbox); 
     }*/ 

     // Loop through the geojson features and extract bbox and name, then add the options to the "zoom" select and build autocomplete(using jquery) 
     var options = '<option value="Select a State">Select a State</option>'; 
     var states = []; 
     for (each in geojson._layers) { 
      var L_AADRESS = geojson._layers[each].feature.properties.L_AADRESS; 
      var swLat = geojson._layers[each].getBounds()._southWest.lat; 
      var swLng = geojson._layers[each].getBounds()._southWest.lng; 
      var neLat = geojson._layers[each].getBounds()._northEast.lat; 
      var neLng = geojson._layers[each].getBounds()._northEast.lng; 
      var bbox = swLat + "," + swLng + "," + neLat + "," + neLng; 

      // Populate states array and build autocomplete 
      states.push({label: L_AADRESS, value: L_AADRESS, swlat: swLat, swlng: swLng, nelat: neLat, nelng: neLng}); 
      $("#search").autocomplete({ 
       source: states, 
       minLength: 3, 
       select: function(event, ui) { 
        map.fitBounds([[ui.item.swlat, ui.item.swlng],[ui.item.nelat, ui.item.nelng]]); 
       } 
      }); 
      // Add states & bbox values to zoom select options 
      options += '<option value="' + bbox + '">' + geojson._layers[each].feature.properties.L_AADRESS + '</option>'; 
     }   

ответ

3

Если я правильно понимаю ваш вопрос вы просто должны добавить:

map.fitBounds(e.layer.getBounds()); 

функции search_locationfound событий , Это установит максимальный уровень масштабирования, который вы все равно сможете увидеть весь слой.

Так функция search_locationfound события из первого примера будет:

searchControl.on('search_locationfound', function(e) { 

    map.fitBounds(e.layer.getBounds()); 
    e.layer.setStyle({fillColor: '#3f0', color: '#0f0'}); 

}); 

jsfiddle

Смежные вопросы