Документация
Справочник JavaScript API
2.1.64 (текущая версия)
collection
interactivityModel
Интерфейсы

Геоссылка

Геоссылка — это простой способ вставить в текст страницы ссылку на Яндекс.Карты. Разработчику достаточно обернуть адрес или название организации, которую нужно показать на карте, в специальные теги. Этот текст и будет геоссылкой. Он будет подсвечиваться на странице специальным образом. Когда пользователь кликнет по геоссылке, откроется всплывающее окно, содержащее статическую карту с меткой по указанному адресу.

При нажатии на кнопку «Подробнее о месте» откроются интерактивные Яндекс.Карты с подробной информацией о заданной точке. Если нажать кнопку «Как добраться», откроются Яндекс.Карты со включенным режимом построения маршрута. В качестве конечной точки на карте будет автоматически указан заданный адрес. Пользователю достаточно будет выставить только начальную точку.

Внимание! Геоссылкой можно сделать только адрес географического объекта, топоним или название организации. Если указать какой-нибудь другой произвольный текст (например, «Наш офис»), то во всплывающем окне будет содержаться сообщение об ошибке:

Как добавить геоссылку

Чтобы добавить на страницу геоссылку, необходимо:

  1. Загрузить на страницу код API с модулем Geolink. Для этого нужно в заголовок HTML-страницы вставить строку:
    <script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&load=Geolink"
     type="text/javascript"></script>
  2. Обернуть нужный текст в HTML-элемент с CSS-классом «ymaps-geolink»:

    <span class="ymaps-geolink">
       Москва, ул. Крылатские холмы, 26
    </span>

Результат:

Примечание. Если геоссылкой нужно сделать название организации, то соответствующему HTML-элементу следует задать атрибут data-type="biz" (подробнее см. Параметры геоссылки).

Когда пользователь кликнет по геоссылке, на карте будет произведен поиск объекта с указанным адресом (в примере выше это «Москва, ул. Крылатские холмы, 26»). Если объект будет найден, то во всплывающем окне будет отображена карта с меткой в найденной точке. Если искомый объект не найден, откроется всплывающее окно с сообщением об ошибке.

Обратите внимание, что даже если в результате поиска найдено несколько объектов, на карте всегда будет показан только один объект — первый из результатов выдачи. Например, при поиске отделений «Почты России» по всей Москве на карте будет показано только одно отделение:

<span class="ymaps-geolink" data-type="biz">
    Москва, Почта России
</span>

Параметры геоссылки

Геоссылке могут быть заданы различные параметры (например, область поиска). Параметры задаются в атрибутах HTML-элемента, в котором определена геоссылка. Могут быть заданы следующие атрибуты:

  • data-type — тип объекта, который нужно показать на карте. Может принимать одно из двух значений: «geo» (адрес) и «biz» (организация). Если параметр не задан, то по умолчанию используется тип «geo». Если для типа «geo» не было найдено ни одного объекта, то будет использоваться тип «biz». Обратите внимание, одновременное задание двух значений «geo» и «biz» не допускается.

  • data-bounds — границы географической области, в которой находится искомый объект. Границы задаются координатами левого нижнего и правого верхнего углов области. Координаты указываются в последовательности «широта, долгота». Например, [[55.729410, 37.584012], [55.738588, 37.598817]]. Данный параметр рекомендуется указывать, если в геоссылке задан неполный адрес объекта, например без указания города или области («ул. Ленина»).

  • data-description — поясняющий текст, который будет отображен в шапке всплывающего окна (см. иллюстрацию ниже). Если не указывать этот атрибут, то в шапке будет отображаться адрес объекта. Обратите внимание, что размеры текстового поля ограничены — в поле помещаются только первые 3 строки. Оставшуюся часть текста пользователь не увидит.

Примечание. Все атрибуты являются необязательными.
<span class="ymaps-geolink" data-type="biz" data-description="Московский офис Яндекса" 
data-bounds="[[55.729410, 37.584012],[55.738588, 37.598817]]">
    Яндекс
</span>

Вставить ссылку на Яндекс.Карты
Геоссылка
Документация
Карты без программирования