2010-03-01 19 views
12

Projem, belirli bir enlem ve boylam sınırı içinde depremlerle ilgili bilgi almak için bir JSON feed'i kullanıyor. Bu bilgileri alıyorum ve tüm sonuçları bir Google haritasındaki işaretleyicilere dönüştürüyorum. Ayrıca bazı ek bilgileri görüntülemek için her bir işaretçiye ihtiyacım var, bu yüzden yerleşik bir InfoWindow nesnesini kullanmaya çalışıyorum; bir işaretçiyi tıkladığınızda, bu işaretçiye ilişkin bazı bilgilerle araç ipucunu açarsınız. Bununla birlikte, hangi işaretleyiciyi tıklattığımı fark etmediğimi, aynı grubun daima o grubun aynı işaretçisinin üzerine çıktığını ve bunun her zaman benim döngümde yarattığım son noktanın olduğuna inanıyorum. İşte kod.Birden çok InfoWindows'ı bir Google Map üzerinde birden fazla İşaretçiye bağlamak ve başarısız olmak için çalışıyor.

$.getJSON(url, function(json) { 
        for(var i = 0; i < json.earthquakes.length; i++) 
        { 
         var pos = new google.maps.LatLng(json.earthquakes[i].lat, json.earthquakes[i].lng); 
         var info = json.earthquakes[i].lat + ", " + json.earthquakes[i].lng; 
         var marker = new google.maps.Marker({ 
          map: map, 
          position: pos, 
          title: json.earthquakes[i].eqid 
         }) 
         var tooltip = new google.maps.InfoWindow({ 
          content: info 
         }) 
         google.maps.event.addListener(marker, 'click', function() { 
          tooltip.open(map, marker); 
         }); 
         markers.push(marker); 
         tooltips.push(tooltip); 
        }    
       }); 

belirteçler harita ve ipuçları tüm işaretleyici nesneler için bir dizi infowindows nesneleri depolamak için bir dizidir. Onlar küresel.

+0

Bu kapanışları işi (işaretleyici kapanmasına referans olarak geçirilir, ne isteyeyim bir kopyasıdır) nasıl kaynaklanmaktadır. Fakat dinleyici çağrıldığında, dinleyicinin eklendiği nesneyi (işaretçiyi) işaret eden “bu” ile olacaktır, böylece 'marker' yerine' this' kullanabilirsiniz. – herman

cevap

20

Bu, google-maps etiketinde sık karşılaşılan bir sorudur ve yapmak kolay bir hatadır :).

Oluyor olan, tıklama etkinliğinizin eşzamansız olarak çağrıldığını ve getJSON geriçağırımındaki (listedeki sonuncu) işaretçi değişkenindeki geçerli değeri almasıdır.

Bir kapatma tıklama geri arama kullanılıyor işaretleyici değişkeni etrafında oluşturulan böylece bir işlevde, addListener çağrıyı tamamlamayı gerek

:

function listenMarker (marker) 
{ 
    // so marker is associated with the closure created for the listenMarker function call 
    google.maps.event.addListener(marker, 'click', function() { 
         tooltip.open(map, marker); 
        }); 
} 

Ardından (burada ana getJSON geri çağırma gelen listenMarker çağrı şu anda addListener'i çağırıyorsunuz).

+3

Bu basit ve açık çözüm için teşekkür ederiz. Infowindow'u kullanarak, daha fazla içerik eklemek için birkaç parametreyi daha işleve geçirebilirsiniz. – dwarbi

+0

-1: bununla birlikte, bu, dinleyicinin eklendiği nesneye başvurduğu için gerekli değildir. – herman

2

AddListener çağrısını kendi işlevine yerleştirmek, aynı metni görüntüleyen birden çok alt pencere sorununu da çözer.

4

YOu da bunu yapabilirsiniz:

// so marker is associated with the closure created for the listenMarker function call 
google.maps.event.addListener(marker, 'click', function() { 
        tooltip.open(map, this); 
       }); 

Nerede "işaretleyici" değiştirmeyse "Bu" eklenti dinleyici çağrısında. Böylece, addListerner kodunu işaretleyiciyi oluşturduğunuz noktada yerleştirebilir ve yeni bir işlev oluşturmanıza gerek kalmaz.

http://you.arenot.me/2010/06/29/google-maps-api-v3-0-multiple-markers-multiple-infowindows/

Kontrol dışarı tam bir çözüm ve bir demo: D

+0

Harika! Teşekkür ederim! – DDelgro

İlgili konular