Arver1 / test_yandex_1

тестовое задание №1

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Задание «Комплексное» («Найди ошибки»)

Описание поиска и перечня ошибок.

Использую редактор WebStorm и Chrome Web Browser.

1.Отсутствие export default или {initMap}

Обратил внимание при сборке,что не найден initMap при импорте.

2.Не заданы размеры контейнера #map.

Запустил приложение,браузер ничего не отобразил.Открыл инструменты разработчика.Посмотрел,что в консоли ошибок нет.Далее решил посмотреть контейнер #map,увидел,что в блочной модели размеры 956x0. Так как уже работал с API Яндекс.Карт на курсах HTML Academy добавил размеры в css.

html,
body,
#map {
  margin: 0;
  padding: 0;
  ***width: 100%***;
  ***height: 100%***;
}

3.Отсутствие myMap.geoObjects.add(objectManager).

После изменений перезапустил webpack,так как из коробки изменения из css файла не подтянутся. Далее начал разбираться построчно в функции initMap до комментариев details и filters,предположив,что детали,а уж тем более фильтры не влияют на то,что метки не отображаются и вероятно ошибка в loadList.Через console.log() посмотрел,что данные(коллекция сущностей) соотвествуют описанию в справочнике v.2.1.68.Посмотрел там же пример,а добавления геообъектов на карту нет,случайность?-Нет не думаю.-).

4.Поменял местами параметры lat и long.

Был крайне удивлен,что карта вновь пустая.Решил посмотреть пример в песочнице(раздел метка) и меня смутил момент,что координаты были [55.8, 37.8],а до этого в консоли первый элемент был с полностью противоположными координатами и это все на одной карте Москвы и явно не просто совпадение...

5.Если неисправный объект входит в кластер, то иконка кластера должна показывать, что в нем есть неисправная станция.

Так как был задан только один цвет

objectManager.clusters.options.set('preset', 'islands#greenClusterIcons');>

Дописал:

function setColorNonWorkCluster(){
    const clusters = objectManager.clusters.getAll();
    if(clusters) {
      clusters.forEach(cluster => {
        if(cluster.properties.geoObjects.some(it => !it.isActive)) {
          objectManager.clusters.setClusterOptions(cluster.id, {
            preset: 'islands#redClusterIcons'
          });
        }
      });
    }
  }

  loadList().then(data => {
    objectManager.add(data);
    setColorNonWorkCluster();
  });

  myMap.events.add('boundschange', function () {
    setColorNonWorkCluster();
  });>

6.Потеря контекста.

При клике popup сыпались ошибки,ну как же иначе?)) Макет пользовательский, и я решил убедиться,что проблема действительно в нем,закомментировал строку

//geoObjectBalloonContentLayout: getDetailsContentLayout(ymaps)

и дописал obj.properties.balloonContent = 'Hello';

      loadDetails(objectId).then(data => {
        obj.properties.details = data;
        obj.properties.balloonContent = 'Hello';
        objectManager.objects.balloon.setData(obj);
      });
    }

При открытии popup ошибки не сыпались,значит дело действительно в макете.Так как функции были стрелочные,через console.log() посмотрел,чему равно this.

7.Неправильное значение max=0.

Эту ошибку нашел практически сразу,так как при просмотре сразу бросилось в глаза

yAxes: [{ ticks: { beginAtZero: true, max: 0 } }]

Заменил max на min и все заработало.)

About

тестовое задание №1