다중 Google지도 폴리선 클릭 이벤트

Question

Google지도 Api를 사용하여 웹 앱을 구축하고 폴리 라인 클릭 이벤트에 문제가 발생했습니다. 지도에 일부 마커를 추가하고 나서 함께 연결하려고했습니다. 폴리 라인을 클릭하면 폴리 라인의 시작점과 끝점 인 마커를 얻을 수 있습니다. 그러나 하나의 결과 만 내가 다른 polylines.Here 내 소스 코드를 클릭하여 모든 번 같은 동일한 반환 : 당신 polyLineClicked 함수에서

var locations = [ 
    { title: "Site 1", lat: 16.044137, lng: 108.206511 }, 
    { title: "Site 2", lat: 16.067161, lng: 108.186259 }, 
    { title: "Site 3", lat: 16.063472, lng: 108.215248 }, 
    { title: "Site 4", lat: 16.041847, lng: 108.193539 }, 
    { title: "Site 5", lat: 16.054186, lng: 108.172890 }, 
]; 

var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 14, 
    center: new google.maps.LatLng(16.067161, 108.186259), 
    mapTypeId: google.maps.MapTypeId.SATELLITE 
}); 

var infowindow = new google.maps.InfoWindow(); 

var polyLineClicked = function (polyline, fromIndex, toIndex) { 
    google.maps.event.addListener(polyline, 'click', function (e) { 
     infowindow.setContent = fromIndex + " to " + toIndex; 
     infowindow.setPosition = event.latLng; 
     infowindow.open(map); 
    }); 
} 
for (var i = 0; i < locations.length; i++) { 
    var position = new google.maps.LatLng(locations[i].lat, locations[i].lng); 
    var marker = new google.maps.Marker({ 
     position: position, 
     map: map 
    }); 

    google.maps.event.addListener(marker, 'click', (function (marker, i) { 
     return function() { 
      infowindow.setContent(locations[i].title); 
      infowindow.open(map, marker); 
     } 
    })(marker, i)); 

    if (i <= locations.length - 2) { 

     var nextPosition = new google.maps.LatLng(locations[i + 1].lat, locations[i + 1].lng); 
     var polyline = new google.maps.Polyline({ 
      path: [position, nextPosition], 
      strokeColor: 'black', 
      strokeOpacity: 1, 
      strokeWeight: 7, 
      map: map, 
      fromPositionIndex: i, 
      toPositionIndex: i+1 
     }); 
     var fromIndex = locations[i].title; 
     var toIndex = locations[i + 1].title; 

     polyLineClicked(polyline, fromIndex, toIndex); 
    } 
} 

Answer 1

을, 당신은 infoWindow class methods를 호출하는 대신의 setContent 및 setPosition를 재 할당된다.

var polyLineClicked = function(polyline, fromIndex, toIndex) { 
    google.maps.event.addListener(polyline, 'click', function(e) { 
    // call the methods instead of reassigning 
    infowindow.setContent(fromIndex + " to " + toIndex); 
    infowindow.setPosition(e.latLng); 
    infowindow.open(map); 
    }); 
}; 

jsfiddle