Как добавить свою форму поиска за пределами Яндекс карты?

Question

Сама форма добавлена с помощью SuggestView. Подскажите как привязать эту форму к карте? Чтобы на карте отображались результаты поиска.

var myMap;

ymaps.ready(init);

function init () {
    
    var suggestView = new ymaps.SuggestView('suggest');
    
    myMap = new ymaps.Map('map', {
       
        center: [55.76, 37.64], // Москва
        zoom: 10
    }, {
        searchControlProvider: 'yandex#search'
    });

}

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
   
    <script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>
   
  <style>
        body, html {
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
        }
        #map {
            width: 100%;
            height: 90%;
        }
    </style>
</head>

<body>

<input type="text" id="suggest"/>

Форма поиска за пределами карты 
<div id="map"></div>

</body>

</html>

Answer 1

Вам следует добавить поисковую панель на карту, если хотите, то скрытую за её краем, и транслировать поисковый запрос или выбранный пункт саджеста в эту панель.

При использвании jquery получиться что-то типа:

suggestView.events.add('select', function () { // поиск по выбору саджеста
    Search()
})

$("#suggest").keyup(function(event){ // поиск по Enter
    if(event.keyCode == 13){
        Search()
    }
});

function Search () { // Непосредственно поиск в панели
    var request = $('#suggest').val();
    searchControl.search(request);
}

Рабочий пример на фиддле (не забудьте подставить свой API-ключ): https://jsfiddle.net/Coroner1st/3fn7payL/

БЛОГ НА HUSL

Как добавить свою форму поиска за пределами Яндекс карты?

Ответы (1 шт):