YandexMap
Это - основной компонент, от которого идут все остальные.
Учтите: карта не работает без указания дополнительных слоёв, отвечающих за её работу.
Слои можно указывать разные, например, на корпоративной версии карты они будут другими.
Конфигурация по умолчанию
См. пример базовой конфигурации YandexMap в разделе Быстрый старт.
Параметры
v-model
Может быть null
или Object
. Возвращает инстанс карты.
Хранить необходимо только в shallowRef
.
const map = shallowRef<null | YMap>(null); //map передать в v-model
settings
Реактивный объект настроек. Поддерживается всё, кроме projection
- его нужно передавать как компонент.
Принимает обязательный параметр location
, в котором вы должны указать начальное состояние карты, а также остальные параметры карты (YMapProps).
См. документацию на сайте Яндекса.
Примечание
Параметры settings
не синхронизируются автоматически с Картами - они работают только на "вход".
Многие параметры, такие как текущее расположение пользователя (center
), вы можете получить из map
(shallowRef
, полученный в v-model
).
Совет
А ещё, тут вы можете указать тёмную тему для карты!
Достаточно указать в settings
theme: 'dark'
.
tag
Тэг карты. По умолчанию: div
width
Ширина карты. По умолчанию: 100%
height
Высота карты. По умолчанию: 100%
zIndex (z-index)
По умолчанию Яндекс сам не задаёт z-index для контейнера, поэтому элементы внутри карты могут перекрывать элементы вашего сайта. Данный параметр сделан для удобства разработчика.
Параметр является числом, по умолчанию 0
.
cursorGrab (cursor-grab)
Добавляет cursor grab/grabbing на слой схемы карты. grabbing будет активироваться только тогда, когда пользователь начнёт движение курсором.
readonlySettings (readonly-settings)
Отключает слежение за объектом настроек. Включите, если вам по каким-то причинам мешает реактивность settings
.
realSettingsLocation (real-settings-location)
По умолчанию при изменении объекта settings
в location
, если он не изменился с прошлого раза, никаких действий выполнено не будет. Это сделано для того, чтобы вы могли менять любые другие настройки, при этом не откидывая пользователя на начальную позицию.
Однако, если вы не изменяете другие параметры, но хотели бы удобнее возвращать пользователя на начальную позицию, вы можете передать props real-location-settings
. При любом триггере settings
(вы можете его вызвать повторным присваиванием location
в ваш .value
, или использовать метод triggerRef) в zoom
, а также center
или bounds
будет подставляться настоящие масштабирование и геолокация пользователя, после чего произойдет изменение.
Внимание
При использовании данного параметра локация пользователя будет изменяться на каждое обновление settings
- при условии, что пользователь что-то делал, конечно.
В случае, если вам нужно и менять параметры в settings
, и возвращать пользователя на начальную позицию, вы можете пользоваться встроенным методом map.setLocation
(или map.value?.setLocation
в setup, где map
- shallowRef
из v-model
).
layers
Не-реактивный массив со слоями. После указания настроек изменение этого объекта не будет давать никакого эффекта.
Задавать слои рекомендуется через template
, а после создания компонента - через addChild
к инстансу карты.