Неправильный код в учебнике для слушателей событий - PullRequest
Новая
       72

Неправильный код в учебнике для слушателей событий

0 голосов
/ 10 ноября 2019

Я следую этому руководству , чтобы создать страницу локатора магазина с картой Mapbox.

Я не хочу добавлять пользовательские маркеры, поскольку у меня уже есть пользовательские метки карты (символы? ), что означает, что мне не нужен необязательный последний раздел учебника, и я остановлюсь сразу после Добавить прослушиватели событий .

После этого страница должна реагировать на щелчки в списке боковой панели, а также на карте (2 прослушивателя событий). Однако в демонстрационной программе , приведенной в учебном пособии для этого конкретного шага, вы можете сказать, что код для второго прослушивателя событий, который делает карту интерактивной, не работает, что заставляет меня поверить в ошибкув предоставленном коде: 

// Add an event listener for when a user clicks on the map
map.on('click', function(e) {
  // Query all the rendered points in the view
  var features = map.queryRenderedFeatures(e.point, { layers: ['locations'] });
  if (features.length) {
    var clickedPoint = features[0];
    // 1. Fly to the point
    flyToStore(clickedPoint);
    // 2. Close all other popups and display popup for clicked store
    createPopUp(clickedPoint);
    // 3. Highlight listing in sidebar (and remove highlight for all other listings)
    var activeItem = document.getElementsByClassName('active');
    if (activeItem[0]) {
      activeItem[0].classList.remove('active');
    }
    // Find the index of the store.features that corresponds to the clickedPoint that fired the event listener
    var selectedFeature = clickedPoint.properties.address;

    for (var i = 0; i < stores.features.length; i++) {
      if (stores.features[i].properties.address === selectedFeature) {
        selectedFeatureIndex = i;
      }
    }
    // Select the correct list item using the found index and add the active class
    var listing = document.getElementById('listing-' + selectedFeatureIndex);
    listing.classList.add('active');
  }
});

Кто-нибудь сможет сказать, что не так с этим кодом?

...