2013-08-26 14 views
5

Używam Google Maps v3 z MarkerClustererPlus. Click for docsAnimowana grupa klastra markerowego

Chcę animować klastra, jeśli klaster zawiera określony znacznik. Animacja jest dość łatwa, jeśli znacznik nie znajduje się wewnątrz klastra.

marker.setAnimation(google.maps.Animation.BOUNCE); 

Ale chcę odbić całą ikonę klastra. Mogę dostać się do klastra z:

markerCluster.getClusters(); 

Ale jak mogę skojarzyć cluster-div z moich getClusters() - tablicę? Nie wiem, który div należy do którego klastra z funkcji getClusters().

Odpowiedz

8

Nie jest to możliwe za pośrednictwem udokumentowanych metod/właściwości, ale możesz uzyskać dostęp do tych właściwości.

  • Krok 1: Każda grupa ma markers_ -property, który jest tablica, która zawiera wszystkie znaczniki klastra. Iteracyjne nad wszystkie klastry i sprawdzić, czy markers _-tablica zawiera poszukiwanych znacznik

  • Krok 2: Po znalezieniu klastra z poszukiwanych markera, dostępu do właściwości clusterIcon_.div_ klastra, który jest elementem który reprezentuje klaster-icon

    //attach listener to clusteringend-event 
    google.maps.event.addListener(markerClustererInstance,'clusteringend',function(){ 
    
    //iterate over all clusters 
    var clusters=this.getClusters(); 
    for(var i = 0; i < clusters.length;++i){ 
    
    if(clusters[i].markers_.length > 1 
         && clusters[i].clusterIcon_.div_){ 
    
         // clusters[i].clusterIcon_.div_ is the HTMLElement 
         // that contains the wanted clusterIcon, 
         // you should at first reset here recently applied changes 
    
         if(clusters[i].markers_.indexOf(wantedMarker)>-1){ 
          //the marker has been found, do something with it 
         } 
        } 
    }}); 
    

    Ale Uwaga: klaster-ikona nie jest google.maps.Marker, nie można po prostu zastosować animację, jak można to zrobić z native markera. Ponadto: Animacje, które modyfikują położenie ikony klastra (np. Odbicie) mogą zakłócać działanie znacznika markerowego, proponuję użyć efektów, które można zastosować poprzez zmiany koloru lub zmiany obrazu tła (ikony klastra, które patrz są tło-obrazy div).

+0

Tak, działa jak czar! Dzięki – chaosbohne

+0

Mam rzeczywiście podobny problem. Animacja klastra została dodana poprzez dodanie klasy do jej div_ (animacja css3). Problem pojawia się jednak, gdy użytkownik przybliża/wygasza zatrzymanie animacji, ponieważ klastry zostały zresetowane, a dodane klasy zniknęły. Próbowałem śledzić znacznik wewnątrz klastra, który chcę animować, a następnie przy powiększeniu, które wyzwala "klastrowanie", ponownie dodaję tę klasę. Jednak to się nie udało ... :(Jak mogę zapobiec zatrzymywaniu się animacji po powiększeniu/pomniejszeniu? –