Маркеры Google Maps не удаляются, даже если массив для маркера равен нулю - PullRequest
0 голосов
/ 23 марта 2020

У меня есть карта Google с 1 пунктом назначения и 2 источниками (зеленый маркер - это источник, а красный - это пункт назначения). есть кнопка, которая, когда я нажимаю, маркеров больше не должно быть на картах Google, но когда я нажимаю кнопку, пункт назначения и 1 источник удаляются, но они по-прежнему 1 маркер источника, даже если исходный массив уже null.

Я следовал за документацией, но маркер происхождения все еще не удаляется.

Map with multiple markers вот пример массива latlong:

address_latlong: Array(3)[
  0: {lat: " 51.43037899999999", lon: "6.7507253"}
  1: {lat: " 52.4870183", lon: "13.4249841"}
  2: {lat: " 48.1877566", lon: "11.5949554"}]

, поскольку пункт назначения и 2 источника находятся в одном массиве, я использовал это для получения последнее значение для назначения и первые 2 для происхождения. это внутри функции с кодами для кода 1 и кода 2 :

var originArray = [], destinationValues = {}, originValues = {};
var lastLength = origDest.address_latlong.length;
    destinationValues = {
        destLat: origDest.address_latlong[lastLength-1].lat,
        destLon: origDest.address_latlong[lastLength-1].lon,
    };

    for(var i = lastLength - 2; i >= 0; i--){
        originValues = {
            orgLat: origDest.address_latlong[i].lat,
            orgLon: origDest.address_latlong[i].lon,
        };

        originArray.push(originValues);
    }

[код 1] вот код для добавления маркера для одного пункта назначения:

if(!findMapNo(1).destination){
    var dest = {
        lat: parseFloat(destinationValues.destLat), 
        lng: parseFloat(destinationValues.destLon)
    };

    //for displaying directions
    route_Search.destination = dest;
    route_Search.destinationName = destinationValues.destName;

    if (findMapNo(1).destination != null) {
       console.log("insert here!!!");
       //findMapNo(1).destination.setMap(null);
       findMapNo(1).destination = [];
       if (findMapNo(1).destination.dragend) {
           google.maps.event.removeListener(findMapNo(1).destination.dragend, 'dragend');
       }
             findMapNo(1).destination = false;
     }

        var icon = {
            url: "http://maps.google.com/intl/en_us/mapfiles/ms/micons/red-dot.png",
            size: new google.maps.Size(50, 50),
            origin: new google.maps.Point(0, 0),
            anchor: new google.maps.Point(17, 54),
            scaledSize: new google.maps.Size(50, 50)
        };

        // Create a marker for each place.
        findMapNo(1).destination = new google.maps.Marker({
            map: findMapNo(1).map,
            icon: icon,
            position: dest,
            draggable: false
        });

        findMapNo(1).destination.latLng = dest;
}

[код 2] вот код для множественного происхождения:

for (var i = 0; i < originArray.length; i++) {

        if(!findMapNo(1).origin[i]){
            var length = originArray.length;
            console.log("length: ", length);

            var org = {
                lat: parseFloat(originArray[i].orgLat), 
                lng: parseFloat(originArray[i].orgLon)
            };

            route_Search.origin[i] = org;

            if(findMapNo(1).origin[i] != null) {
                console.log("insert");
                console.log(findMapNo(1).origin[i]);
                findMapNo(1).origin[i].setMap(null);
                if (findMapNo(1).origin[i].dragend) { 
             google.maps.event.removeListener(findMapNo(1).origin[i].dragend, 'dragend');
                }
                findMapNo(1).origin[i] = false;
            }   

            // Create a marker for each place.
            findMapNo(1).origin[i] = new google.maps.Marker({
                map: findMapNo(1).map,
                icon: "http://maps.google.com/intl/en_us/mapfiles/ms/micons/green-dot.png",
                position: org,
                draggable: false
            });

            findMapNo(1).origin[i].latLng = org;

вот код моей кнопки для удаления маркеры:

$("#portletHead").on("click", ".backCollectionOrigin", function() {
   if (findMapNo(1).destination) {
        //i used 1 here because the the first data is always empty
        for(var i = 1; i < findMapNo(1).origin.length; i++){
            findMapNo(1).origin[i].setMap(null);
        }

        findMapNo(1).origin = [];
        findMapNo(1).destination.setMap(null);
        directionsDisplay.setMap(null);

    }

   }
 }

функция для findMapNo, где arrayMAp = [] :

function findMapNo(no) {
    for (i = 0; i < arrayMAp.length; i++) {
        if (arrayMAp[i].mapNo == no) {
            return arrayMAp[i];
        }
    }
 }

1 Ответ

4 голосов
/ 25 марта 2020

Вы должны поместить созданные маркеры карты в массив следующим образом:

var markers[];

function addMarkers(){
    var marker = new google.maps.Marker({
        position: location,
        map: map
   });
        markers.push(marker);
}

Затем внутри функции, удаляющей маркер, вы можете очистить массив markers[] и очистить карту с помощью маркеров с помощью делаем что-то вроде этого:

function deleteMarkers(){
    for(i=0; i<markers.length;i++){
      markers[i].setMap(null);
    }
    markers = [];
  }

Вот пример реализации, которая показывает, как добавлять и удалять маркеры с карты: https://jsbin.com/fuxupecepi/edit?html, вывод

Примечание: пожалуйста, добавьте ваш собственный ключ API в данном примере реализации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...