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

<link rel="stylesheet" href="/resources/assets/leaflet.css" /> <script src="/resources/assets/leaflet/js/thereach/leaflet.js"></script> <link rel="stylesheet" href="/resources/assets/leaflet/Control.FullScreen.css" /> <script src="/resources/assets/leaflet/Control.FullScreen.js"></script>

<script>

   const bounds = [
       [0, 1280], // Southwest coordinates
       [1280, 0] // Northeast coordinates
   ];
   const dungeonIcon = L.icon({
     iconUrl: '/resources/assets/leaflet/icons/dungeon.png', // Замените на свой URL
     iconSize: [48, 48], // Размеры иконки
     iconAnchor: [22, 14], // Точка привязки иконки
   });
   const areafinterestIcon = L.icon({
     iconUrl: '/resources/assets/leaflet/icons/poi_areaofinterest_complete.png', // Замените на свой URL
     iconSize: [48, 48], // Размеры иконки
     iconAnchor: [22, 14], // Точка привязки иконки
   });
   const houseIcon = L.icon({
     iconUrl: '/resources/assets/leaflet/icons/poi_group_house_owned.png', // Замените на свой URL
     iconSize: [48, 48], // Размеры иконки
     iconAnchor: [22, 14], // Точка привязки иконки
   });
   const arenaIcon = L.icon({
     iconUrl: '/resources/assets/leaflet/icons/poi_solotrial_complete.png', // Замените на свой URL
     iconSize: [48, 48], // Размеры иконки
     iconAnchor: [22, 14], // Точка привязки иконки
   });
   const campfireIcon = L.icon({
     iconUrl: '/resources/assets/leaflet/icons/poi_camp_complete.png', // Замените на свой URL
     iconSize: [48, 48], // Размеры иконки
     iconAnchor: [22, 14], // Точка привязки иконки
   });
 const map = L.map('map', {
   crs: L.CRS.Simple,
   minZoom: -1,
   maxZoom: 4,
   maxBounds: bounds,

center: [640, 640],

   fullscreenControl: true,

fullscreenControlOptions: {position: 'topleft'},

   forcePseudoFullscreen: true,
   zoom: 0
 }).setView([640, 640], 0);
 const mainBounds = [[0, 0], [1280, 1280]];
 const mainLayer = L.imageOverlay('/images/6/67/Reach_base.jpg', mainBounds).addTo(map);
 map.fitBounds(mainBounds);

// events are fired when entering or exiting fullscreen. map.on('enterFullscreen', function () { console.log('entered fullscreen');

   map.setZoom(0);

});

map.on('exitFullscreen', function () { console.log('exited fullscreen');

   map.setZoom(-1);

});

 // Шаблон перехода в под-карту
 function createZone(bounds, name, tooltip, subMapPath, subBounds) {
   const zone = L.polygon(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);
   });
 }
 function addZones() {
   createZone([
   [628, 242],
   [635, 243],
   [640, 254],
   [637,275],
   [639,278],
   [657,287],
   [663,296],
   [663,296],
   [659,324],
   [665,337],
   [656,360],
   [647,373],
   [646,384],
   [632,396],
   [616,389],
   [606,369],
   [601,352],
   [596,344],
   [581,351],
   [573,336],
   [572,320],
   [574,302],
   [571,287],
   [574,264],
   [583,249],
   [596,252]

], 'Markarth', '🏰 Маркарт', '/images/d/d4/Markarthcity_base.jpg', [[0, 0], [1280, 1280]]);

 }
 addZones();
   const MarkarthIcon = L.icon({
     iconUrl: '/resources/assets/leaflet/icons/Markarth.png', // Замените на свой URL
     iconSize: [252, 74], // Размеры иконки
     iconAnchor: [22, 14], // Точка привязки иконки
   });

L.marker([1064, 478], {icon: MarkarthIcon}).addTo(map); }); </script>