Открыть меню
Переключить меню настроек
Открыть персональное меню
Вы не представились системе
Ваш IP-адрес будет виден всем, если вы внесёте какие-либо изменения.

<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" /> <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script> <script>

 const map = L.map('map', {
   crs: L.CRS.Simple,
   minZoom: -1,
   maxZoom: 4,
   zoom: 0
 });
 const mainBounds = [[0, 0], [1280, 1280]];
 const mainLayer = L.imageOverlay('https://eso-wiki.ru/images/6/67/Reach_base.jpg', mainBounds).addTo(map);
 map.fitBounds(mainBounds);
 // Шаблон перехода в под-карту
 function createZone(bounds, name, tooltip, subMapPath, subBounds) {
   const zone = L.rectangle(bounds, { color: "#ffa500", weight: 1 }).addTo(map);
   zone.bindTooltip(tooltip).openTooltip();
   zone.on('click', () => {
     map.eachLayer(layer => map.removeLayer(layer));
     const subMap = L.imageOverlay(subMapPath, subBounds).addTo(map);
     map.fitBounds(subBounds);
     const backButton = L.control({ position: 'topright' });
     backButton.onAdd = function () {
       const div = L.DomUtil.create('div', 'leaflet-bar');
       div.innerHTML = '<a href="#" title="Назад">← Назад</a>';
       div.onclick = function () {
         map.eachLayer(layer => map.removeLayer(layer));
         mainLayer.addTo(map);
         map.fitBounds(mainBounds);
         addZones(); // вернём зоны заново
         return false;
       };
       return div;
     };
     backButton.addTo(map);
   });
 }

L.marker([1064, 478], {icon: dungeonIcon}).addTo(map).bindPopup("

<a href=https://eso-wiki.ru/index.php/Храм_Верных_Клятве>Храм Верных Клятве</a>
Подземелье

");

 function addZones() {
   createZone([[600, 900], [750, 1100]], 'Markarth', '🏰 Маркарт', 'https://eso-wiki.ru/images/d/d4/Markarthcity_base.jpg', [[0, 0], [800, 1000]]);
   createZone([[300, 200], [500, 400]], 'Blackreach', '🕳️ Черный Предел', 'https://eso-wiki.ru/images/7/7b/Auridon_base.jpg', [[0, 0], [1024, 1024]]);
   createZone([[1000, 300], [1200, 600]], 'KarthRiver', '🏞️ Долина Карта', '/images/maps/KarthRiver_valley.jpg', [[0, 0], [900, 700]]);
 }
 addZones();

</script>