Форма поиска на карте через Google Maps API v2

Часто случается, что встраивая карту Google на свой сайт — встает необходимость поиска по ней без перезагрузки страницы. В Google Maps API v2 нет возможности добавить поиск, как обычный элемент управления, поэтому придется немного изменить свой скрипт.

Приступим.

  1. Для работы нам потребуется API поиска Google AJAX.
  2. Предполагается, что карта уже добавлена на страницу, все нужно подключено. После строки инициализации библиотеки google api в разделе <head> вашей странички:

    Вписываем следующий код, тем самым подключая скрипты и стили для осуществления поиска:

    Стили можно не загружать, если планируете сами делать дизайн поисковой строки.
  3. Находим скрипт инициализации вашей карты. Выглядит он примерно так:

    Добавляем во внутрь следующий код:

    Данный скрипт отвечает за добавление поиска. Вторым параметром мы указываем расположение строки поиска и положение по x,y относительно указанной стороны. Описание и возможные варианты расположения блоков можно посмотреть в официальной документации.
  4. Теперь мы должны инициализировать поиск, добавив следующую строку после функции gmap():
  5. В итоге мы получаем вот такую картину:
    Вывод строки поиска на картах GoogleИ сморим пример по ссылке, для понимания, как должен выглядеть весь код.