2010-11-01 13 views
5

Birden çok çizgi içeren bir haritam var ve çizgi tıklatıldığında çizgiye özgü bir özet açmak istiyorum.Google Haritalar V3 ile çoklu çoklu çizgiler ve altlıklar V12

Şimdiye kadar benim kodum yalnızca son yinelemenin içeriğini gösterir.

İstediğim şeyin iki güzel örneğini buldum ama çalışma saatlerinden sonra hala daha fazla değilim.
Örnek 1: http://srsz750.appspot.com/api3/polylines-multiple.html
Örnek 2: http://www.geocodezip.com/v3_GenericMapBrowser.asp?filename=flights090414.xml

Yani senin benim son atış şunlardır:

for (var i = 0; i < locations.length; i++) { 
var route = locations[i]; // locations is an array of route-arrays. 
//route is an array with details. route[0] contains the description. 

var imageStart = 'img/rijder.png'; 
var polyOptions = { 
    strokeColor: '#0000FF', 
     strokeOpacity: 1.0, 
    strokeWeight: 3 
    }  

    poly = new google.maps.Polyline(polyOptions, info); 
    var path = poly.getPath(); 

//line text 

var info = route[0]; 
google.maps.event.addListener(poly, 'click', function(event) { 
    infowindow.setContent(info); 
    infowindow.position = event.latLng; 
infowindow.open(map); 
    }); 

//startmarker 
var startLatLng = new google.maps.LatLng(route[1], route[2]); 
var smarker = new google.maps.Marker({ 
    position: startLatLng, 
    map: map, 
    icon: imageStart, 
    title: route[7], 
    html: route[0]  
}); 
path.push(startLatLng); 
//starttext 

google.maps.event.addListener(smarker, "click", function() { 
     infowindow.setContent(this.html); 
     infowindow.open(map, this); 
     }); 

//endmarker 
var endLatLng = new google.maps.LatLng(route[4], route[5]); 
var emarker = new google.maps.Marker({ 
    position: endLatLng, 
    map: map, 
    icon: imageEnd, 
    title: route[8], 
    html: route[3]  
}); 
path.push(endLatLng); 
//endtext 

google.maps.event.addListener(emarker, "click", function() { 
      infowindow.setContent(this.html); 
      infowindow.open(map, this); 
     }); 
//close line and put on the map 
poly.setMap(map); 
} 
} 

: Burada

-S son tekrarlamanın sadece içeriği gösterir benim kodudur Ve işte çalışmayı beklediğim kod ama tüm satırlar kayboldu (sadece ilgili kod, ayrıca bir mouseover işlevi ekledim):

//line text 
    google.maps.event.addListener(poly, 'click', (function(event,index){ 
    return function(){ 
    var routeinfw = locations[index]; 
    var inf = routeinfw[0]; 
    infowindow.setContent(inf); 
    infowindow.position = mouselocation; 
    infowindow.open(map); 
     }; 
    })(event,i)); 

//starticon 

cevap

9

Deftere örnekte, tıklama etkinlikleri dinleyicileri oluşturmak ve yerleri döngü içinden diyoruz için bir işlevi oluşturmak Tıpkı:

function createInfoWindow(poly,content) { 
    google.maps.event.addListener(poly, 'click', function(event) { 
     infowindow.content = content; 
     infowindow.position = event.latLng; 
     infowindow.open(map); 
    }); 
} 

Ve döngünün sonunda bu çağırabilirsiniz:

createInfoWindow(poly,info); 
+1

kodunuz, poligonlarla bir ANCHORING problemi çözer (event.latLng - işaretçileriyle tamamıyla bağlantı kurmazlar, tamam). Yani, infowindow.open (map, event.latLng) 'nin aksine, infowindow'u açıkça konumlandırmak, google maps' buggy polygon event interface'ine iyi bir çözümdür. –

+1

yardım ettiğine sevindim! – ifaour