0

我第一次涉足 Google Maps API,我希望在点击时出现独特的内容(每个标记的差异 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 来做到这一点,然后让它正确拉入 infoWindow。

任何和所有的帮助表示赞赏。谢谢!

4

1 回答 1

0

每个标记都需要打开一个不同的 InfoWindow 实例,该实例又具有不同的内容集。

创建标记时,您可以轻松地向引用相应信息窗口实例的标记添加额外属性。然后,“单击”事件可以使用该引用打开正确的信息窗口。

于 2011-05-12T05:29:44.843 回答