Как добавить окно поиска в открытых слоях 3 - PullRequest
0 голосов
/ 29 сентября 2018

Я попробовал пример открытых слоев 3, он только добавляет окно поиска, но не ищет места, ниже приведен код -

<div id="search" style="position: absolute; top: 10px; right: 10px; padding: 5px; background-color: rgba(255,255,255,0.5);">
      <input type="text" placeholder="place" style="width: 200px">
      <button type="button">Search</button>
    </div>

Это другой метод, который я пробовал, но онговорит "геокодер не определен", кто-нибудь может предложить какой-либо другой метод?

var geocoder = new Geocoder('nominatim', {
  provider: 'mapquest',
  key: 'osm',
  lang: 'pt-BR', //en-US, fr-FR
  placeholder: 'Search for ...',
  targetType: 'text-input',
  limit: 5,
  keepOpen: true
});
map.addControl(geocoder);
geocoder.on('addresschosen', function(evt){
  var feature = evt.feature,
      coord = evt.coordinate,
      address = evt.address;
  // some popup solution
  content.innerHTML = '<p>'+ address.formatted +'</p>';
  overlay.setPosition(coord);
});

1 Ответ

0 голосов
/ 04 октября 2018

Похоже, вы пытались реализовать плагин Geocoder от Jonatas Walker: https://github.com/jonataswalker/ol-geocoder (или это реализовано в последней версии openlayers? - откуда вы взяли этот пример?)

В этом случае, я думаю, вам не хватает двух вещей:

1) Добавьте код CSS и javascript в ваш шаблон или index.html:

<link href="https://cdn.jsdelivr.net/npm/ol-geocoder@latest/dist/ol-geocoder.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/ol-geocoder"></script>

2) Создайтеи зарегистрируйтесь для получения ключа на Mapquest , так как это обязательно для этого провайдера, или попробуйте с другим провайдером, которому не требуется ключ, например osm:

var geocoder = new Geocoder('nominatim', {
  provider: 'osm', //change it here
  lang: 'en-US',
  placeholder: 'Search for ...',
  targetType: 'text-input',
  limit: 5,
  keepOpen: true
});
...