поиск ввода листовок вне карты div (переделать) - PullRequest
2 голосов
/ 28 мая 2020

У меня небольшая проблема, я работаю над картами Leaflet, и я понятия не имею, как я могу сделать этот поиск ввода, показывает те же результаты, что и поиск ввода внутри карты, я ищу ответы и несколько примеров , даже в той же самой брошюре, и я не могу найти ничего ясного, надеюсь, вы можете мне с этим помочь. код Js создает поиск ввода на карте, но мне нужно выполнить поиск ввода вне карты, делает то же самое.

<input id="search" type="search" class="sb-search-input" name="Search" autocomplete="off" placeholder="Enter your search term..." id="search" required=""/>
<div id="mapid" class="col-md-12" style="height: 400px;"></div>

      let map = L.map("mapid").setView([-33.45, -70.666667], 4);

L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
  attribution:
    '&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors',
}).addTo(map);

var searchText = L.esri.Geocoding.geosearch().addTo(map);

//adding layer groups on the search control
var results = L.layerGroup().addTo(map);

searchText.on("results", function (data) {
  results.clearLayers();

  for (var i = data.results.length - 1; i >= 0; i--) {
    results.addLayer(L.marker(data.results[i].latlng));

    console.log(data.results[i].latlng);
  }
});

1 Ответ

1 голос
/ 31 мая 2020

ну спасибо всем, ха-ха, я мог бы это сделать, но проблема в том, что беспорядок мой bootstrap, в любом случае вот решение.

var searchText = L.esri.BootstrapGeocoder.search({  
 //here we call the input id.
  inputTag: 'search',
  placeholder: 'ex. LAX',
}).addTo(map);
//adding layer groups on the search control
var results = L.layerGroup().addTo(map);

searchText.on('results', function(data){

  results.clearLayers();

  for (var i = data.results.length - 1; i >= 0; i--) {

    results.addLayer(L.marker(data.results[i].latlng));    
    console.log(data.results[i].latlng);
  }
})
...