Googleマップの別のインフォウィンドウのユニークなコンテンツapi v3

Question

Google Maps APIに初めて入ると、クリックしたときに表示される固有のコンテンツ（各マーカーのdiff iframe youtube vid）が必要でした。私はその作業を一度行っていましたが、別の情報ウィンドウがクリックされたときに情報ウィンドウを閉じることはできませんでした。

次のデモコードを変更して、もう一方がクリックされたときに開くようにしましたが、クリックされたマーカーに基づいてコンテンツを変更することはできません。

var Demo = { 
map: null, 
infoWindow: null 
}; 

/** 
* Called when clicking anywhere on the map and closes the info window. 
*/ 
Demo.closeInfoWindow = function() { 
Demo.infoWindow.close(); 
}; 

/** 
* Opens the shared info window, anchors it to the specified marker, and 
* displays the marker's position as its content. 
*/ 
Demo.openInfoWindow = function(marker) { 
var markerLatLng = marker.getPosition(); 
Demo.infoWindow.setContent([ 
'<b>Marker position is:</b><br/>', 
markerLatLng.lat(), 
', ', 
markerLatLng.lng() 
].join('')); 
Demo.infoWindow.open(Demo.map, marker); 
}, 

/** 
* Called only once on initial page load to initialize the map. 
*/ 
Demo.init = function() { 
// Create single instance of a Google Map. 
var centerLatLng = new google.maps.LatLng(0, 0); 
Demo.map = new google.maps.Map(document.getElementById('map-canvas'), { 
zoom: 13, 
center: centerLatLng, 
zoom: 2, 
    maxZoom:3, 
    minZoom:2, 

    disableDefaultUI: true, 
mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

// Create a single instance of the InfoWindow object which will be shared 
// by all Map objects to display information to the user. 
Demo.infoWindow = new google.maps.InfoWindow(); 

// Make the info window close when clicking anywhere on the map. 
google.maps.event.addListener(Demo.map, 'click', Demo.closeInfoWindow); 

// Add multiple markers in a few random locations around San Francisco. 
// First random marker - CHINA 
var marker1 = new google.maps.Marker({ 
map: Demo.map, 
position: new google.maps.LatLng(33.4, 103.8), 
}); 

// Register event listeners to each marker to open a shared info 
// window displaying the marker's position when clicked or dragged. 
google.maps.event.addListener(marker1, 'click', function() { 
Demo.openInfoWindow(marker1); 
}); 

// Second random marker - Uruguay 
var marker2 = new google.maps.Marker({ 
map: Demo.map, 
position: new google.maps.LatLng(-32.81, -55.88), 
}); 

// Register event listeners to each marker to open a shared info 
// window displaying the marker's position when clicked or dragged. 
google.maps.event.addListener(marker2, 'click', function() { 
Demo.openInfoWindow(marker2); 
}); 


} 

私は各マーカーにはiframeを含むコンテンツのための変数を作成する必要があります知っているが、私はそれを行うのに十分なjsのを知っているし、それが情報ウィンドウに正しく引く必要はありません。

何かすべての助けがありがとうございます。ありがとう！

Answer 1

各マーカーはInfoWindowの別のインスタンスを開く必要があり、InfoWindowは異なるコンテンツセットを持っています。

マーカを作成するときに、適切なInfoWindowのインスタンスを参照するマーカに追加のプロパティを簡単に追加できます。 'click'イベントは、その参照で正しいInfoWindowを開くことができます。