- Модальное всплывающее окно с картой
- Карта на всю ширину страницы, либо с кастомным размером
- Данные из JSON, либо по API
- Вызов/инициализация из JS
<head>
...
<link rel='stylesheet' type='text/css' href='YMW.css'>
<!-- Подключение стилей виджета /-->
...
</head>
<body>
...
<div id="WidgetMap"></div>
<!-- Блок виджета (поместить туда, где будет карта или
куда-угодно если карта будет только полноэкранной/всплывающей) /-->
...
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&apikey=<Yandex-API-Key>"
type="text/javascript"></script>
<!-- Подключение API Яндекс.Карт.
<Yandex-API-Key> - Ваш ключ /-->
<script type='text/javascript' src="YMW.js"></script>
<!-- Подключение кода виджета /-->
<script type='text/javascript'>
ymaps.ready(async function () { // Выполняется после успешного подключения к Api Яндекс.Карт
await initMW('WidgetMap', 'Widget_Places.json'); // Инициализация виджета
HideMap('WidgetMap');
// Скрыть карту
ShowMap('WidgetMap', 0, {Fixed:true});
// Показать стандартный виджет 420х420 без кнопки Закрыть
ShowMap('WidgetMap', 1);
// Показать виджет высотой 420 на всю ширину родителя с кнопкой Закрыть
ShowMap('WidgetMap', 0, {H:'300px', W:'600px', Fixed:true});
// Показать виджет с кастомными шириной и высотой, без кнопки Закрыть
ShowMap('WidgetMap', 2, {Fixed:true});
// Показать полноэкранный виджет без кнопки Закрыть
ShowMap('WidgetMap', 2);
// Показать полноэкранный виджет с кнопкой Закрыть
ShowMap('WidgetMap', 3);
// Показать модальный виджет (всплывающее окно) с кнопкой Закрыть
});
</script>
...
</body>
[ // Массив мест на карте
{ // Объект
"coord": [ // Координаты заведения
55.750285,
37.542059
],
"address": "Россия, Москва, Пресненская набережная, 2", // Адрес заведения
"name": "Золотое яблоко", // Название заведения
"description": "Магазин парфюмерии и косметики", // Описание объекта
"phones": [ // Массив с номерами телефонов (строка через запятую)
"8 (800) 770-70-21"
],
"city": { // город в котором находится объект
"center": [ // координаты города
55.755826,
37.617300
],
"content": "Москва" // название города
},
"time": [ // Массив с временем работы заведения (строка через запятую)
"пн-чт 10:00–23:00",
" пт 10:00–20:00"
],
"url": "https://goldapple.ru/" // Ссылка на сайт заведения,
"email": "[email protected]" // Email заведения
},
{
"coord": [
59.931715,
30.359388
],
"address": "Россия, Санкт-Петербург, Невский проспект, 114-116",
"name": "Золотое яблоко",
"description": "Магазин парфюмерии и косметики",
"phones": [
"8 (800) 770-70-21"
],
"city": {
"center": [
59.931058,
30.360910
],
"content": "Санкт-Петербург"
},
"time": [
"пн-чт 10:00–23:00",
" пт 10:00–21:00",
" сб 14:00–23:00",
" вс 10:00–23:00"
],
"url": "https://goldapple.ru/",
"email": "[email protected]"
}
]
