Ponowne upuszczanie wielu znaczników Google Maps bez odświeżania na mapie

Question

Mam duży (~ 1300) zestaw znaczników, które umieszczam na mapie na osi czasu. Zasadniczo jest to jak odtwarzanie wideo, w którym w ciągu sekwencji czasu znaczniki są umieszczane przy użyciu mapy google.maps.Animation.DROP. Mamy standardowe kontrolki odtwarzacza wideo/audio, które pozwalają poruszać się po linii czasu: odtwarzaj/wstrzymuj, pomiń, aby rozpocząć, przeskocz do końca, i pasek szorowania, aby poruszać się dowolnie na osi czasu.

Jeśli zacznę od pustej mapy, a oś czasu zostanie wstrzymana na początku, a następnie do końca, pojawi się krótkie opóźnienie, ponieważ wszystkie te obiekty znaczników zostaną utworzone, a następnie wszystkie zostaną umieszczone razem na mapie. Jest okej.

Po umieszczeniu znacznika, a użytkownik przesuwa się w tył na osi czasu (do miejsca, w którym dany znacznik nie powinien być już widoczny) robię marker.setMap(null), a znacznik jest ukryty. Z tego, co mam read, jest to właściwy sposób na usunięcie znacznika i działa.

Duży problem pojawia się, jeśli utworzysz/upuść wszystkie (lub dużą liczbę) znaczników, a następnie powrócisz na osi czasu (tak, że duża liczba znaczników zostanie usunięta), a następnie ponownie przeskocz do przodu. Tworzy to paskudny błysk pinezek na mapie, które znikają i nagle spadają z górnej części mapy.

Jak wspomniano, prawidłowy efekt (piny wpadają bez wcześniejszego pojawienia się na mapie) zdarzają się najpierw, gdy szpilki spadną, ale kolejne spadki powodują to dziwne zachowanie. W przypadku niewielkiej liczby pinów jest on w dużej mierze niezauważalny, ale z wieloma pinami jest znacznie bardziej rozpraszający.

Wygląda na to, że w wewnętrznym stanie znacznika musi być coś, co marker.setMap(null) nie resetuje się naprawdę, ale nie jestem wcale pewien, co to może być.

Pierwotnie utworzyłem nowe znaczniki w razie potrzeby, a następnie je niszczyłem, gdy zniknęły, ale ten narzut powodował, że rzeczy były powolne. Teoretycznie mam wrażenie, że moje podejście powinno działać przez cały czas, ale zasadniczo uzyskuję jeden dobry efekt z odpowiednim efektem, a powtórzenia zachowują się źle.

Czy ktoś widzi coś, co robię źle lub mam sugestie, jak to zrobić?

Logika który dodaje szpilki, pokazy i skóry jest grubsza następująco:

Realtime.prototype.placePin = function(ent) { 
    var ctxt = this; 

    ent.latLng = new google.maps.LatLng(ent.lat, ent.lng); 

    ent.marker = new google.maps.Marker({ 
     position: ent.latLng, 
     map: null, 
     animation: google.maps.Animation.DROP, 
     optimized: false 
    }); 
}; 

Realtime.prototype.tick = function(force_tick) { 
    var ctxt = this; 

    if ((!ctxt.playing || ctxt.dragging) && !force_tick) { 
     return; 
    } else { 
     ctxt.time += ctxt.per_tick; 
    } 
    ctxt.nowDate = new Date(ctxt.time * 1000); 

    ctxt.pins_to_drop = [];  
    for (var i = 0, l = ctxt.entries.length; i < l; i++) { 
     var ent = ctxt.entries[i]; 
     var ent_date = new Date(ent.created + ' UTC'); 
     if (ent_date < ctxt.nowDate) { 
      if (!ent.marker || ent.marker.map == null) { 
       if (!ent.marker) { 
        ctxt.placePin(ent); 
       } 
       ctxt.pins_to_drop.push(ent); 
      } 
     } else { 
      if (ent.marker && ent.marker.map != null) { 
       ent.marker.setMap(null); 
      } 
     } 
    } 

    ctxt.updateUI(); 

}; 

Realtime.prototype.updateUI = function() { 
    var ctxt = this; 

    for (var i = 0, l = ctxt.pins_to_drop.length; i < l; i++) { 
     var ent = ctxt.pins_to_drop[i]; 
     ent.marker.setMap(null); 
     ent.marker.setAnimation(google.maps.Animation.DROP); 
     ent.marker.setMap(ctxt.map); 
    } 
}; 

Answer 1

Zobacz updated fiddle i nie jestem pewien, czy to rozwiąże problem, ale w inny sposób do ukrycia/pokazania się znacznik nazywa się setVisible() znacznika jako marker.setVisible(boolean). Animacja upuszczania w tym przypadku zadziała tylko po raz pierwszy, ponieważ setVisible() ponownie nie kojarzy znacznika z mapą, ponieważ jest już powiązana.