Яндекс JavaScript API - Как определить отобразилась карту юзеру или нет?

Question

Для получения карты в мобильном приложении используется метод JavaScript API - https://api-maps.yandex.ru/2.1/?apikey=ваш API-ключ&lang=ru_RU.

Есть ли возможность отслеживать корректное отображение карты у юзера, то есть видит ли юзер корректное изображение карты или же, если что-то пошло не так, только клетчатую подложку?

Answer 1

Первое, что можно проверить - корректную загрузку карты через события карт

map.events.add('load', function() {
    console.log('Карта успешно загружена');
});

map.events.add('error', function(error) {
    console.error('Ошибка загрузки карты:', error);
    // Обработка ситуации с клетчатой подложкой
});

Второе - проверить загрузился ли слой, на котором отрисовываются тайлы

//Может со временем класс слоя изменится, но пока такой
const tiles = document.querySelectorAll('.ymaps-2-1-79-ground-pane canvas');

let loadedTiles = 0;
tiles.forEach(tile => {
    if (tile.width > 0 && tile.height > 0) {
        loadedTiles++;
    }
});
    
if(tiles.length > 0 && loadedTiles === tiles.length)
    console.log('Слой загружен')
else
    console.log('Слой с тайлами не загружен')

И третье - проверка ошибок загрузки картинок

window.addEventListener('error', function(e) {
//А тут можно вообще сделать отправку всех ошибок к себе в бэк
//так как не на всех клиентах можно глянуть логи

    if(e.target.tagName==='IMG' && e.target.src.includes('yandex')){
        console.error('Ошибка загрузки тайла');
    }
}, true);

БЛОГ НА HUSL

Яндекс JavaScript API - Как определить отобразилась карту юзеру или нет?

Ответы (1 шт):