@aliver13

Как добавить кнопки zoom на Яндекс Карту?

Ужасно запарился, выручайте. Документацию читал, но как-то не так, по всей видимости.

Подключаю скрипт
<script src="https://api-maps.yandex.ru/v3/?apikey=API&lang=ru_RU"></script>
<script>

Короче, сам код добавления карты на html страницу
initMap();

async function initMap() {
  // Промис `ymaps3.ready` будет зарезолвлен, когда загрузятся все компоненты основного модуля API
  await ymaps3.ready;

  const {YMap, YMapDefaultSchemeLayer, YMapDefaultFeaturesLayer, YMapMarker, YMapControls, YMapZoomControl} = ymaps3;

  const map = new YMap(
      // Передаём ссылку на HTMLElement контейнера
      document.getElementById('map'),
      // Передаём параметры инициализации карты
      {
          location: {
              // Координаты центра карты
              center: [37.588144, 55.733842],
              // Уровень масштабирования
              zoom: 10
          },
          behaviors: ['drag', 'pinchZoom', 'dblClick']
      }
  );

  // Добавляем слой для отображения схематической карты
  map.addChild(new YMapDefaultSchemeLayer({
    theme: "dark", customization: mapCustomizationJson
  }));
  
  // Пытаюсь добавить кнопку Зума
  const controls = new YMapControls();
  controls.addChild(
      new YMapZoomControl({
          easing: 'linear'
      })
  );
  
  map.addChild(controls);


  map.addChild(new YMapDefaultFeaturesLayer());
}

Я сюда не положил переменную mapCustomizationJson, т.к. она огромная (и вроде на кнопки зума не влияет)

Короче, в документации написано, что ср*ный зум добавляется так:
const map = new YMap(element, {
  location: {center: [37.588144, 55.733842], zoom: 14}
});

const controls = new YMapControls();
controls.addChild(
  new YMapZoomControl({
    easing: 'linear'
  })
);

map.addChild(controls);


Как вы можете видеть в моем коде, я так и сделал (как мне кажется).
Ошибка, которую я получаю
Uncaught (in promise) TypeError: YMapZoomControl is not a constructor
at initMap ((index):1097:7)


Я не знаю в чем дело и чертовски близок к тому, чтобы сдаться.
В свой код я также добавил два класса YMapControls, YMapZoomControl
const {YMap, YMapDefaultSchemeLayer, YMapDefaultFeaturesLayer, YMapMarker, YMapControls, YMapZoomControl} = ymaps3;
  • Вопрос задан
  • 545 просмотров
Решения вопроса 1
yesbro
@yesbro
Думаю, помогаю думать
YMapZoomControl импортируется из другого места. Сам недавно матерился по этому поводу. У них все самое полезное можно в примерах найти https://yandex.ru/dev/jsapi30/doc/ru/examples/case...

const {YMapZoomControl} = await ymaps3.import('@yandex/ymaps3-controls@0.0.1')
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы