谷歌地圖API添加infowindow到單擊事件上的標記數組

Question

我試圖做一個標記數組，並讓每個標記打開一個信息窗口與相關信息onclick但我得到一個無法讀取'應用'屬性的undefined或者打開錯誤的標記;我的2個企圖是：

無法讀取應用：

var infowindow = new google.maps.Infowindow(); 
for (var i=0;i<popular.length;i++){ 
    var mkrLatLng = new google.maps.LatLng(popular[i][1], popular[i][2]); 
    var marker = new google.maps.Marker({ 
     map: map, 
     title: popular[i][0], 
     position: mkrLatLng 
    }); 
    markers.push(marker); 
} 

for (var i=0;i<markers.length;i++){ 
    markers[i].addListener('click', (function(){ 
    console.log('click'); 
    cont = "<div> " + markers[i].title + " </div>"; 
    infowindow.setContent(cont); 
    infowindow.open(map, marker); 
    })(markers)); 
} 

打開上錯誤標記（匿名函數包裝在另一個函數，因爲它擺脫了未定義錯誤的，我不明白爲什麼）：

var infowindow = new google.maps.Infowindow(); 
for (var i=0;i<popular.length;i++){ 
    var mkrLatLng = new google.maps.LatLng(popular[i][1], popular[i][2]); 
    var marker = new google.maps.Marker({ 
     map: map, 
     title: popular[i][0], 
     position: mkrLatLng 
    }); 
    marker.addListener('click', function(){(function(){ 
     console.log('click'); 
     cont = "<div> " + marker.title + " </div>"; 
     infowindow.setContent(cont); 
     infowindow.open(map, marker); 
    })(marker)}); 
    markers.push(marker); 
} 

Answer 1

你的結構是錯誤的

這是示例enter link description here

//wrong 
for(var i=0;i<3;i++){ 
    var count=i 
    $('<p>wrong</p>').on('click',function(){ 
     alert(count) 
    }).appendTo('body') 
} 
//what you want 
for(var i=0;i<3;i++){ 
    createEl(i) 
} 
function createEl(i){ 
$('<p>correct</p>').on('click',function(){ 
     alert(i) 
    }).appendTo('body') 
} 

希望這將幫助你理解爲什麼你錯了

所以，你需要更改您的代碼此

for(){ 
    createMarker(parameter) 
} 
function createMarker(parameter){ 
    var marker=..., 
     infowindow=.... 
    marker.addlistener(...) 
    ....... 
} 

Answer 2

試試你的第二個代碼，使VAR信息窗口全球，也許它會工作，我不知道。

否則，你可以在forloop中新建每個infowindow，並推入數組，就像處理標記一樣。

var mark = new google.maps.Marker({ 
     map: map, 
     position: place.geometry.location, 
     optimized: false, 
     icon: 'red-dot.png' 
    }), 
    infowindow = new google.maps.InfoWindow() 
infowindow.setContent(place.name) 
infowindows.push(infowindow) 
//then addlistener to marker 
//markers.push(marker) 

打開剛纔一個信息窗口，使用infowindow.close（）關閉所有信息窗口，

然後調用infowindow.open（地圖，標記）