Не могу понять, где ошибка и почему он карты не инициализируются на сайте
Ни при каких условиях, пробовал уже подключать и 3 версии ключ и обычный, всё равно ошибки выдаются, что не распознает код 3 версии,прикладываю html\js код и ошибки. Часть кода customization убрана, чтобы место не занимать
let center = [59.68249328771387, 80.28810420751564];
function init() {
let map = new ymaps3.Map('map-test', {
center: center,
zoom: 3,
});
let main = new ymaps3.Placemark([55.796238068961486, 37.76556099999989], {
balloonContent: `
<div class="balloon">
<div class="balloon__address">Главный офис</div>
<div class="main_balloon">
<p>105037, г Москва, проезд Измайловский, д. 5А, пом. 34H</p>
</div>
<div class="balloon__contacts">
<a href="tel:+74955104944">+7 (495) 510‑49-44</a>
<a href="mailto:[email protected]">[email protected]</a>
</div>
<button class="balloon_button_how">Как добраться?</button>
</div>
`
}, {
iconLayout: 'default#image',
iconImageHref: 'https://static.tildacdn.com/tild3930-3839-4532-b936-643761656462/marker.svg',
iconImageSize: [42, 42],
iconImageOffset: [0, -0]
});
let warehouse = new ymaps3.Placemark([55.82353006891234, 37.78104749999992], {
balloonContent: `
<div class="balloon">
<div class="balloon__address">Складкской комплекс</div>
<div class="main_balloon">
<p>г. Москва, 107497, ул. Иркутская д.17, стр. 8</p>
</div>
<div class="balloon__contacts">
<a href="tel:+74955104944">+7 (495) 510‑49-44</a>
<a href="tel:+74956603351">+7 (495) 660‑33-51</a>
<a href="mailto:[email protected]">[email protected]</a>
</div>
<button class="balloon_button_how">Как добраться?</button>
</div>
`
}, {
iconLayout: 'default#image',
iconImageHref: 'https://static.tildacdn.com/tild3930-3839-4532-b936-643761656462/marker.svg',
iconImageSize: [32, 32],
iconImageOffset: [0, -0]
});
let spb = new ymaps3.Placemark([59.88791609656807, 30.325855173610595], {
balloonContent: `
<div class="balloon">
<div class="balloon__address">Санкт-Петербург</div>
<div class="main_balloon">
<p>196084, ул. Коли Томчака д.20Б лит. В</p>
</div>
<div class="balloon__contacts">
<a href="tel:+78123870671">+7 (812) 387-06-71</a>
<a href="mailto:[email protected]">[email protected]</a>
</div>
<button class="balloon_button_how">Как добраться?</button>
</div>
`
}, {
iconLayout: 'default#image',
iconImageHref: 'https://static.tildacdn.com/tild3930-3839-4532-b936-643761656462/marker.svg',
iconImageSize: [24, 24],
iconImageOffset: [0, -0]
});
let kazan = new ymaps3.Placemark([55.74847256898776, 49.1120105], {
balloonContent: `
<div class="balloon">
<div class="balloon__address">Казань</div>
<div class="main_balloon">
<p>ООО “КОБРА-КАЗАНЬ”.</p>
<p>г.Казань, ул. Турбинная, 7</p>
</div>
<div class="balloon__contacts">
<a href="tel:+78432586266">+7 (843) 258 62 66</a>
<a href="tel:+79872667244">+7 (987) 266 72 44</a>
<a href="tel:+79274325274">+7 (927) 432 52 74</a>
<a href="mailto:[email protected]">[email protected]</a>
</div>
<button class="balloon_button_how">Как добраться?</button>
</div>
`
}, {
iconLayout: 'default#image',
iconImageHref: 'https://static.tildacdn.com/tild3930-3839-4532-b936-643761656462/marker.svg',
iconImageSize: [24, 24],
iconImageOffset: [0, -0]
});
let krasnodar = new ymaps3.Placemark([45.01330007458955, 38.995740499999954], {
balloonContent: `
<div class="balloon">
<div class="balloon__address">Краснодар</div>
<div class="main_balloon">
<p>350001, ул. Вишняковой, 5/2</p>
</div>
<div class="balloon__contacts">
<a href="tel:+78612990505">+7 (861) 299-05-05</a>
<a href="mailto:[email protected]">[email protected]</a>
</div>
<button class="balloon_button_how">Как добраться?</button>
</div>
`
}, {
iconLayout: 'default#image',
iconImageHref: 'https://static.tildacdn.com/tild3930-3839-4532-b936-643761656462/marker.svg',
iconImageSize: [24, 24],
iconImageOffset: [0, -0]
});
let ussuruisk = new ymaps3.Placemark([43.792093074582596, 131.97923299999994], {
balloonContent: `
<div class="balloon">
<div class="balloon__address">Уссурийск</div>
<div class="main_balloon">
<p>Олеся Кожемякина</p>
<p>Менеджер по продажам ООО «СДМ»</p>
</div>
<div class="balloon__contacts">
<a href="tel:+79146815702">+7(914) 681-57-02</a>
<a href="mailto:[email protected]">[email protected]</a>
</div>
<button class="balloon_button_how">Как добраться?</button>
</div>
`
}, {
iconLayout: 'default#image',
iconImageHref: 'https://static.tildacdn.com/tild3930-3839-4532-b936-643761656462/marker.svg',
iconImageSize: [24, 24],
iconImageOffset: [0, -0]
});
map.controls.remove('geolocationControl'); // удаляем геолокацию
map.controls.remove('trafficControl'); // удаляем контроль трафика
map.controls.remove('searchControl'); // удаляем поиск
map.controls.remove('typeSelector'); // удаляем тип
map.controls.remove('fullscreenControl'); // удаляем кнопку перехода в полноэкранный режим
map.controls.remove('rulerControl'); // удаляем контрол правил
map.behaviors.disable(['scrollZoom']); // отключаем скролл карты (опционально)
map.geoObjects.add(main);
map.geoObjects.add(warehouse);
map.geoObjects.add(spb);
map.geoObjects.add(kazan);
map.geoObjects.add(krasnodar);
map.geoObjects.add(ussuruisk);
}
ymaps3.ready(init);
map.addChild(new YMapDefaultSchemeLayer({
customization:
}));
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="map-test" class="map"></div>
<script src="https://api-maps.yandex.ru/v3/?apikey=***мойапиключ***&lang=ru_RU"></script>
</script>
<script src="script.js"></script>
</body>
</html>
Ответы (1 шт):
Автор решения: YaSupport
→ Ссылка
Вы используете классы для JS API 2.1, но подключаете их с помощью ymaps3 — пространства имён для третьей версии. Подключение API в HTML-коде также должно быть для используемой в проекте версии, шаблоны подключения можно взять из раздела Документации Быстрый старт для JS API 2.1 и для JS API 3.0.
Присылаю исправленный пример, карта инициализируется и метки отображаются на карте.