73 lines
2.7 KiB
PHP
73 lines
2.7 KiB
PHP
<div class="map">
|
||
<div class="container">
|
||
<h2 class="map_title">Наш адрес</h2>
|
||
<div class="location__map">
|
||
<div class="map_address">
|
||
<?php echo esc_html( carbon_get_theme_option( 'site_address' ) ); ?>
|
||
<span><?php echo esc_html( carbon_get_theme_option( 'site_name' ) ); ?></span>
|
||
</div>
|
||
<div id="ya-map" style="width: 100%; height: 420px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
(function() {
|
||
// Координаты и флаги — берём из PHP один раз
|
||
var mapCoords = [<?php echo esc_js( carbon_get_theme_option( 'site_location' ) ); ?>];
|
||
var mapLabel = '<?php echo esc_js( carbon_get_theme_option( 'site_name' ) ); ?>';
|
||
var mapLoaded = false;
|
||
var apiLoading = false;
|
||
|
||
function initMap() {
|
||
ymaps.ready(function() {
|
||
var map = new ymaps.Map('ya-map', {
|
||
center: mapCoords,
|
||
zoom: 16
|
||
}, {
|
||
searchControlProvider: 'yandex#search'
|
||
});
|
||
var placemark = new ymaps.Placemark(
|
||
mapCoords,
|
||
{ iconContent: mapLabel },
|
||
{ preset: 'islands#redStretchyIcon' }
|
||
);
|
||
map.geoObjects.add(placemark);
|
||
mapLoaded = true;
|
||
});
|
||
}
|
||
|
||
function loadYandexMaps() {
|
||
if (mapLoaded || apiLoading) return;
|
||
apiLoading = true;
|
||
|
||
// Динамически создаём тег <script> — API грузится только сейчас,
|
||
// а не при загрузке страницы. Экономит ~200kb в критическом пути.
|
||
var script = document.createElement('script');
|
||
script.src = 'https://api-maps.yandex.ru/2.1/?lang=ru_RU';
|
||
script.onload = initMap;
|
||
document.head.appendChild(script);
|
||
}
|
||
|
||
// Запускаем загрузку при первом скролле > 100px
|
||
function onScroll() {
|
||
var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
||
if (scrollTop > 100) {
|
||
loadYandexMaps();
|
||
window.removeEventListener('scroll', onScroll);
|
||
}
|
||
}
|
||
|
||
// Запасной вариант: если карта видна без скролла (большой экран)
|
||
// — грузим через 3 секунды после загрузки страницы
|
||
window.addEventListener('load', function() {
|
||
setTimeout(function() {
|
||
if (!mapLoaded && !apiLoading) {
|
||
loadYandexMaps();
|
||
}
|
||
}, 3000);
|
||
});
|
||
|
||
window.addEventListener('scroll', onScroll, { passive: true });
|
||
})();
|
||
</script>
|