Заменить карту маршрута на OpenStreetMap

2026-09-19 16:58:43 +08:00
parent 6dc97a8b1d
commit 9f813397b1
3 changed files with 66 additions and 2 deletions
@@ -1,2 +1,46 @@
-<section class="route-wrap" id="route"><div class="page"><div class="page-title"><h3>Карта пешеходного маршрута</h3><p>Маршрут построен в Яндекс Картах в режиме «пешком»: исторический центр, Нижняя набережная, Карла Маркса, Александр III, острова Юность и Конный и выход к Бабру в 130-м квартале.</p></div><div class="map-card"><div class="route-map-frame"><iframe src="https://yandex.ru/map-widget/v1/?mode=routes&rtext=52.288050%2C104.281500~52.291140%2C104.281272~52.292265%2C104.282609~52.293444%2C104.286194~52.291389%2C104.297500~52.287300%2C104.290000~52.282233%2C104.284712~52.278972%2C104.281083~52.276685%2C104.277768~52.275489%2C104.277109~52.273500%2C104.279500~52.272800%2C104.278500~52.273398%2C104.274517~52.271900%2C104.273900~52.270200%2C104.274800~52.269350%2C104.277000~52.269373%2C104.278123~52.268550%2C104.279250~52.268300%2C104.278150~52.269350%2C104.277000~52.270900%2C104.277700~52.272800%2C104.278500~52.273850%2C104.279650~52.274850%2C104.282050~52.275550%2C104.284250~52.276000%2C104.286483&rtt=pd&z=14&l=map" loading="eager" allowfullscreen="true" title="Пешеходный маршрут по Иркутску"></iframe></div></div></div></section>
-
+<section class="route-wrap" id="route">
+  <div class="page">
+    <div class="page-title">
+      <h3>Карта пешеходного маршрута</h3>
+      <p>24 остановки по историческому центру Иркутска: от Сквера Кирова через Карла Маркса и набережную Ангары до 130-го квартала.</p>
+    </div>
+    <div class="map-card">
+      <div class="route-map-frame">
+        <div id="irkutsk-route-map" role="application" aria-label="Карта пешеходного маршрута по Иркутску"></div>
+      </div>
+      <div class="map-note"><span class="map-note-line"></span><span>Номера на карте совпадают с порядком остановок ниже</span></div>
+    </div>
+  </div>
+</section>
+<script>
+(() => {
+  const mapElement = document.getElementById('irkutsk-route-map');
+  if (!mapElement || typeof L === 'undefined') return;
+  const stops = [
+    ['Сквер Кирова',52.288050,104.281500],['Здание правительства — «Серый дом»',52.291140,104.281272],
+    ['Спасская церковь',52.292265,104.282609],['Памятник Петру и Февронии',52.293444,104.286194],
+    ['Собор Богоявления',52.291389,104.297500],['Польский костёл',52.287300,104.290000],
+    ['Нижняя набережная и памятник Якову Похабову',52.282233,104.284712],['Московские ворота',52.278972,104.281083],
+    ['Русско-Азиатский банк',52.276685,104.277768],['Дом архитектора В. А. Рассушина',52.275489,104.277109],
+    ['Драматический театр им. Н. П. Охлопкова',52.273500,104.279500],['Книжный магазин и типография Макушина и Посохина',52.272800,104.278500],
+    ['Усадьба С. Н. Верхоленцева',52.273398,104.274517],['Сибирский торговый банк',52.271900,104.273900],
+    ['Театр-иллюзион Яджоглу',52.270200,104.274800],['Дом Воллернера',52.269350,104.277000],
+    ['Торговый дом фирмы «Треугольник»',52.269373,104.278123],['Мануфактурный магазин Второвых',52.268550,104.279250],
+    ['Типография Восточно-Сибирской железной дороги',52.268300,104.278150],['Памятник Александру III',52.269350,104.277000],
+    ['Остров Юность',52.270900,104.277700],['Остров Конный',52.272800,104.278500],
+    ['130-й квартал',52.273850,104.279650],['Скульптура Бабра',52.276000,104.286483]
+  ];
+  const routeMap = L.map(mapElement,{scrollWheelZoom:false,zoomControl:false});
+  L.control.zoom({position:'bottomright'}).addTo(routeMap);
+  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{maxZoom:19,attribution:'&copy; OpenStreetMap contributors'}).addTo(routeMap);
+  const coordinates = stops.map(([,lat,lng]) => [lat,lng]);
+  L.polyline(coordinates,{color:'#d8a653',weight:5,opacity:.9,lineCap:'round',lineJoin:'round'}).addTo(routeMap);
+  const bounds = L.latLngBounds(coordinates);
+  stops.forEach(([title,lat,lng],index) => {
+    const marker = L.marker([lat,lng],{icon:L.divIcon({className:'route-marker-wrap',html:`<span class="route-marker">${index+1}</span>`,iconSize:[36,36],iconAnchor:[18,18]})}).addTo(routeMap);
+    marker.bindPopup(`<strong>${index+1}. ${title}</strong><br><span>Пешеходный маршрут по Иркутску</span>`);
+  });
+  routeMap.fitBounds(bounds,{padding:[28,28]});
+  window.addEventListener('resize',()=>routeMap.invalidateSize(),{passive:true});
+})();
+</script>