Google 어스에서 각 마커에 대한 링크가있는 마커 배열

Question

다음 코드는 특정 Google 어스 마커를 클릭 할 때 사용자를 리디렉션하지 못합니다. 다른 모든 것은 잘 작동합니다. 어떤 포인터?

자바 스크립트 :

$(function() { 
    var latArray = ($("#google_map_section").attr("data-lat")).split(", "); 
    var longArray = ($("#google_map_section").attr("data-long")).split(", "); 
    var nameArray = ($("#google_map_section").attr("data-name")).split(", "); 
    var urlArray = ($("#google_map_section").attr("data-url")).split(", "); 
    var mylatlngs = []; 
    var markers = []; 
    var counter = 0; 
    var bounds = new google.maps.LatLngBounds(); 

    while(counter < latArray.length){ 
     mylatlngs.push(new google.maps.LatLng(
      parseFloat(latArray[counter]), 
      parseFloat(longArray[counter])) 
     ); 
     counter++ 
    }; 
    var myOptions = { 
     zoom: 12, 
     center: mylatlngs[mylatlngs.length-1], 
     mapTypeId: google.maps.MapTypeId.SATELLITE 
    }; 
    var map = new google.maps.Map(document.getElementById("google_map_section"), 
     myOptions 
    ); 
    counter = 0; 
    while (counter < mylatlngs.length){ 
     markers.push(new google.maps.Marker({ 
      position: mylatlngs[counter], 
      map: map, 
      title: nameArray[counter], 
      url: urlArray[counter] 
     })); 
     bounds.extend(mylatlngs[counter]); 
     counter++ 
    }; 
    counter = 0; 
    while (counter < markers.length){ 
     google.maps.event.addListener(markers[counter], 'click', function() { 
      window.location.href = this[counter].url; 
     }); 
     counter++ 
    }; 
    map.fitBounds(bounds); 
    }); 

HTML 페이지 소스 :

<div id="google_map_section" data-url="http://localhost:3000/impacts/12, http://localhost:3000/events/9, http://localhost:3000/impacts/10, http://localhost:3000/events/7" data-name="Dead fish!, Oil spill, Acid River Pollution, AMD Seepage" data-lat="-34.0, -34.0333333, -33.638271, -33.724289" data-long="17.0, 18.35, 18.990891, 18.95591"></div> 

업데이트 :

방화범이 event.addListener의 함수 내에서 다음과 같은 경고를 제공합니다 "catch되지 않은 형식 오류 : 정의되지 않은 'url'속성을 읽을 수 없습니다. "

또한 업데이트 :

url: urlArray[counter] 

나는의 EventListener에 직접 배열의 요소를 할당하면 지금이 흥미 롭다 : 문제는이 라인에있는 URL에 할당

좋아하다 좋아요 :

google.maps.event.addListener(markers[counter], 'click', function() { 
    window.location.href = urlArray[counter]; 
}); 

여전히 작동하지 않지만 URL을 하드 코딩합니다. 이렇게 :

google.maps.event.addListener(markers[counter], 'click', function() { 
    window.location.href = 'http://www.google.com'; 
}); 

작품! 도대체 뭐야?

Answer 1

아하! 알았다. 어떤 이유로 이벤트 리스너는 별도의 기능으로 할당되어야합니다. 어쨌든, 마커에 대한 작동 코드는 다음과 같습니다 :

while (counter < mylatlngs.length){ 
    marker = new google.maps.Marker({ 
     position: mylatlngs[counter], 
     map: map, 
     title: nameArray[counter], 
     url: urlArray[counter] 
    }); 
    addListen(marker); 
    markers.push(marker); 
    bounds.extend(mylatlngs[counter]); 
    counter++; 
}; 

map.fitBounds(bounds); 

function addListen(markerPass){ 
    google.maps.event.addListener(markerPass, 'click', function() { 
     window.location.href = markerPass.url; 
    }); 
}; 

누군가가이 일을하는 이유에 대한 언급을 여전히 환영 ...