Nhiều polylines và infowindows với Google Maps V3

Question

Tôi có một bản đồ có nhiều đường polycines và muốn mở một dòng thông tin cụ thể khi nhấp vào dòng.

Cho đến nay mã của tôi chỉ hiển thị nội dung của lần lặp cuối cùng.

Tôi tìm thấy hai ví dụ rất hay về những gì tôi muốn nhưng sau nhiều giờ cố gắng tôi vẫn không còn nữa.
Ví dụ 1: http://srsz750.appspot.com/api3/polylines-multiple.html
Ví dụ 2: http://www.geocodezip.com/v3_GenericMapBrowser.asp?filename=flights090414.xml

Vì vậy, bạn là bắn cuối cùng của tôi: -S

Đây là mã của tôi mà chỉ hiển thị các nội dung của phiên cuối cùng:

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); 
} 
} 

Và đây là mã tôi mong đợi để làm việc nhưng tất cả các dòng biến mất (chỉ có mã có liên quan, tôi cũng thêm chức năng di chuột):

//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 

Answer 1

Cũng giống như trong ví dụ bạn đăng, tạo một chức năng để tạo ra các sự kiện nhấp chuột nghe và gọi nó từ bên trong địa điểm vòng lặp:

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

Và bạn có thể gọi đây là ở phần cuối của vòng lặp:

createInfoWindow(poly,info);