Удалить все маркеры из карты при нажатии на кнопку - PullRequest
0 голосов
/ 13 января 2019

Я знаю, что есть команда "marker.remove ()", которая позволяет мне удалить маркер сразу после того, как я добавил его на карту. Следующий код является частью цикла for:

      var marker = new mapboxgl.Marker(el)
      .setLngLat(markeryellowhalf.geometry.coordinates)
      .addTo(map);
      //marker.remove();

Но моя идея состоит в том, чтобы нажать кнопку, которая вызывает новую функцию. И первое, что должна сделать эта функция, это удалить (или скрыть) все маркеры.

С какой командой я могу запустить эту функцию? Конечно, «marker.remove ()» здесь не работает.

Это мой объект карты:

    var map = new mapboxgl.Map({    
    style: 'mapbox://styles/mapbox/dark-v9',
    center: [30, 0],
    zoom: 1.2,
    // pitch: 45,
    // bearing: -17.6,
    container: 'map'
});

Тогда myFunction1 ...

function myFunction1(){
.
.
.
switch (statusArray1[c]){
    case "existing [completed]":
    geojson.features.forEach(function(markeryellow) {

      // create a HTML element for each feature
      var el = document.createElement('div');
      el.className = 'markeryellow';

      // make a markeryellow for each feature and add to the map
    var marker = new mapboxgl.Marker(el)
      .setLngLat(markeryellow.geometry.coordinates)
      .setPopup(new mapboxgl.Popup({ offset: 25 }) // add popups
      .setHTML('<h3>' + markeryellow.properties.title + '</h3><p>' + markeryellow.properties.description + '</p>'))
      .addTo(map);
      //marker.remove();
    });
    break;
    case "under construction [on hold]":
    case "under construction [foundation work]":
    case "under construction [frame assembly]":
    case "under construction [topped out]":
    geojson.features.forEach(function(markeryellowhalf) {

      // create a HTML element for each feature
      var el = document.createElement('div');
      el.className = 'markeryellowhalf';

      // make a markeryellowhalf for each feature and add to the map
        var marker = new mapboxgl.Marker(el)
      .setLngLat(markeryellowhalf.geometry.coordinates)
      .setPopup(new mapboxgl.Popup({ offset: 25 }) // add popups
      .setHTML('<h3>' + markeryellowhalf.properties.title + '</h3><p>' + markeryellowhalf.properties.description + '</p>'))
      .addTo(map);
      //marker.remove();
    });



    break;
}

}

}

Затем приходит myFunction2 () {... }

1 Ответ

0 голосов
/ 13 января 2019

вы можете попробовать это так:

map.on('click', function (e) {

   //define that to delete or todo here

});

но для более точного ответа мне нужна дополнительная информация, например html/css и ваш map object

...