Карты в блоках

Блоки с картой показывают на странице интерактивную карту с маркерами: адрес офиса, точки самовывоза, схему проезда. Такое поведение включает subtype: map в секции block манифеста блока.

Подтип избавляет от ручной настройки: он сам описывает ноду карты, добавляет нужные атрибуты, подставляет стартовые координаты и подключает скрипт инициализации. Если карта нужна статичной картинкой или встраивается сторонним виджетом, подтип не нужен.

Сценарий состоит из трех частей:

• в секции block манифеста указан subtype: map
• в assets.ext подключено расширение landing_map — оно приносит скрипт, который строит карту на странице
• в разметке блока есть нода .landing-block-node-map

Нода .landing-block-node-map должна быть в разметке заранее: подтип обрабатывает только этот селектор, а без него карту не к чему привязать.

Как настроить блок с картойКак настроить блок с картой

Минимальный вариант манифеста:

'block' => [
    'name' => 'Карта',
    'section' => ['contacts'],
    'subtype' => 'map',
],
'assets' => [
    'ext' => ['landing_map'],
],

Пример разметки:

<section class="landing-block g-pt-0 g-pb-0 g-height-70vh">
    <div class="landing-block-node-map h-100"></div>
</section>

Что делает подтип картыЧто делает подтип карты

Обработчик подтипа дополняет манифест блока:

• описывает .landing-block-node-map как ноду типа map
• добавляет атрибуты data-map и, если провайдера можно выбрать, data-map-provider
• дописывает в assets.ext значение map_init
• определяет текущего провайдера по значению data-map-provider в разметке блока
• отключает кеширование манифеста для такого блока

При добавлении блока на страницу подтип заполняет пустой атрибут data-map: подставляет центр карты, масштаб 17 и один маркер. Центр зависит от региона Битрикс24: для России, Украины и остальных регионов используются разные координаты. Тогда же в разметку записывается провайдер — по правилу из раздела ниже.

Если data-map уже заполнен в разметке блока, подтип не трогает ни его, ни провайдера: значения из разметки остаются как есть.

Если для выбранного провайдера не включены карты или не заполнен ключ, подтип добавляет в манифест requiredUserAction. В редакторе пользователь увидит обязательное действие с переходом в настройки сайта.

Какие провайдеры используютсяКакие провайдеры используются

Провайдер хранится в атрибуте data-map-provider ноды карты. Допустимые значения:

• google — Google Maps
• yandex — Яндекс Карты, доступные только в российском регионе Битрикс24

Когда блок добавляют на страницу, подтип выбирает провайдера так:

• в российском регионе записывает yandex, если Яндекс Карты включены с ключом или если не настроен ни один провайдер
• во всех остальных случаях записывает google

Карты работают только с ключом провайдера. Ключ и признак использования задают в настройках сайта или страницы, а через REST — дополнительными полями GMAP_USE и GMAP_CODE для Google Maps и YMAP_USE и YMAP_CODE для Яндекс Карт. Состав полей описан в статьях Дополнительные поля сайта и Дополнительные поля страницы.

Переключатель провайдера появляется в настройках блока только там, где доступны Яндекс Карты. В остальных регионах карта всегда строится на Google Maps.

Для Google Maps дополнительно доступны визуальные параметры. В манифесте подтип объявляет их не в корневом ключе attrs, а в style.nodes ноды карты — поэтому в редакторе они попадают в форму дизайна. Но хранятся они все равно в атрибутах ноды, и через REST их меняет метод landing.block.updateattrs:

Примеры штатных блоковПримеры штатных блоков

Коды некоторых штатных блоков:

• 16.1.google_map
• 16.2.two_cols_text_map_fix
• 16.3.two_cols_map_text_fix
• 16.5.two_cols_map
• 16.6.two_cols_map_reverse

Как изменить карту через RESTКак изменить карту через REST

У размещенного блока настройки карты хранятся в атрибутах ноды .landing-block-node-map: data-map — центр, масштаб и маркеры в формате JSON, data-map-provider — провайдер. Структура значения data-map описана в статье Типы нод.

Значения этих атрибутов меняет метод landing.block.updateattrs, текущее состояние черновика показывает landing.block.getcontent с параметром editMode = true, а увидеть изменения на сайте можно после публикации страницы методом landing.landing.publication.

Права и ограниченияПрава и ограничения

Scope: landing

Кто может выполнять метод: в зависимости от метода

Ограничения:

• в штатных блоках карт подключают расширение landing_map. Расширение landing_google_maps_new собственных файлов не добавляет и подтягивает то же landing_map, поэтому в новых блоках его не используют
• стартовые настройки подставляются один раз, при добавлении блока на страницу. У блока, который уже стоит на странице, значения меняет только landing.block.updateattrs

Продолжите изучениеПродолжите изучение

• Специальные блоки: обзор сценариев
• Блоки-меню
• Навигация и заголовок
• Результаты поиска
• Формы поиска
• Формы в блоках