2012-12-07 230 views
3

我想創建一些地圖標記的偵聽器。我可以創建標記並將它們放在地圖上,但無論我點擊哪個標記,都會告訴我"Uncaught TypeError: Cannot call method 'open' of undefined"。當我打開代碼時,它會顯示標記[46],這是最高索引的一個標記。而且它總是在同一個索引上點擊哪個標記並不重要。谷歌地圖infowindow

編輯:我編輯了代碼並粘貼了所有代碼。沒有錯誤,但是當我點擊標記時沒有任何反應。我期待在Chrome和它看起來像心不是一個事件處理程序註冊

<script> 
var map; 
var nav = []; 
$(document).ready(function() { 
    //initialise a map 
    init(); 
    var infowindow = new google.maps.InfoWindow({}); 
    $.get("xxxxxx.kml", function (data) { 
     html = ""; 
     //loop through placemarks tags      
     i = 1; 
     $(data).find("Placemark").each(function (index, value) { 
      //get coordinates and place name 
      coords = $(this).find("coordinates").text(); 
      contentString = $(this).find("description").text(); 


      var partsOfStr = coords.split(','); 
      var lat = parseFloat(partsOfStr[0]); 
      var lng = parseFloat(partsOfStr[1]); 
      var myLatLng = new google.maps.LatLng(lng, lat); 
      place = $(this).find("name").text(); 

      createMarker(myLatLng, place, contentString, i) 

      //store as JSON 
      c = coords.split(",") 
      nav.push({ 
       "place": place, 
       "lat": c[0], 
       "lng": c[1] 
      }) 
      //output as a navigation 
      html += "<li>" + place + "</li>"; 
      i++; 
     }); 
     //output as a navigation 
     $(".navigation").append(html); 

     //bind clicks on your navigation to scroll to a placemark 

     $(".navigation li").bind("click", function() { 

      panToPoint = new google.maps.LatLng(nav[$(this).index()].lng, nav[$(this).index()].lat) 

      map.panTo(panToPoint); 
     }) 

    }); 
    markers = []; 

    function createMarker(myLatLng, title, contentString, i) { 
     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      title: title 
     }); 

     google.maps.event.addListener(markers, 'click', function() { 
      infoWindow.setContent(contentString); 
      infowindow.open(map, markers[i]); 
     }); 
     markers[i] = marker; 
     return marker 
    } 

    function init() { 

     //google.maps.event.addDomListener(window, 'init', Initialize); 
     var latlng = new google.maps.LatLng(39.047050, -77.131409); 
     var myOptions = { 
      zoom: 4, 
      center: latlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 

     }; 
     map = new google.maps.Map(document.getElementById("map"), myOptions); 


    } 


}) 

+0

哥們我不你的問題但建議你參考谷歌地圖開發指南有不同的例子。 –

回答

7

這幾乎是一個常見問題。當你的循環結束時,我的值是46(根據你的陳述)。沒有標記46,所以所有的點擊監聽失敗。它可以通過函數閉包來解決(一個createMarker函數,用於保存標記和infowindow內容之間的關聯)。

像這樣的事情在你的例子(未測試),從標記創建循環中調用它,需要一個全球性的標誌物陣列,但不要求全球信息窗口陣列:

//global markers array 
markers = []; 
// global infowindow 
var infowindow = new google.maps.InfoWindow({}); 

// createMarker function 
function createMarker(myLatLng, title, contentString, i) 
{ 
    var marker = new google.maps.Marker({ 
    position: myLatlng , 
    map: map, 
    title:title 
}); 

    google.maps.event.addListener(markers, 'click', function() { 
    infoWindow.setContent(contentString); 
    infowindow.open(map,markers[i]); 
    }); 
    markers[i] = marker; 
    return marker 
}