我从这个例子中工作:http://storelocator.googlecode.com/git/examples/panel.html
我希望能够添加一个侦听器到这样的所有标记,但我不知道如何引用它们,因为它们是由商店定位器从DataFeed创建的。
google.maps.event.addListener(marker, 'click', //myCode);
这与示例中的面板代码完全相同:
google.maps.event.addDomListener(window, 'load', function() {
var map = new google.maps.Map(document.getElementById('map-canvas'), {
center: new google.maps.LatLng(-28, 135),
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var panelDiv = document.getElementById('panel');
var data = new MedicareDataSource;
var view = new storeLocator.View(map, data, {
geolocation: false,
features: data.getFeatures()
});
new storeLocator.Panel(panelDiv, {
view: view
});
});
看看这个例子。如果你只是想自定义信息窗口的内容,那就使用那个部分。
// Store locator with customisations
// - custom marker
// - custom info window (using Info Bubble)
// - custom info window content (+ store hours)
var ICON = new google.maps.MarkerImage('medicare.png', null, null,
new google.maps.Point(14, 13));
var SHADOW = new google.maps.MarkerImage('medicare-shadow.png', null, null,
new google.maps.Point(14, 13));
google.maps.event.addDomListener(window, 'load', function() {
var map = new google.maps.Map(document.getElementById('map-canvas'), {
center: new google.maps.LatLng(-28, 135),
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var panelDiv = document.getElementById('panel');
var data = new MedicareDataSource;
var view = new storeLocator.View(map, data, {
geolocation: false,
features: data.getFeatures()
});
view.createMarker = function(store) {
var markerOptions = {
position: store.getLocation(),
icon: ICON,
shadow: SHADOW,
title: store.getDetails().title
};
return new google.maps.Marker(markerOptions);
}
var infoBubble = new InfoBubble;
view.getInfoWindow = function(store) {
if (!store) {
return infoBubble;
}
var details = store.getDetails();
var html = ['<div class="store"><div class="title">', details.title,
'</div><div class="address">', details.address, '</div>',
'<div class="hours misc">', details.hours, '</div></div>'].join('');
infoBubble.setContent($(html)[0]);
return infoBubble;
};
new storeLocator.Panel(panelDiv, {
view: view
});
});
或者甚至这样做:
view.createMarker = function(store) {
var markerOptions = {
position: store.getLocation(),
title: store.getDetails().title
};
var marker = new google.maps.Marker(markerOptions);
google.maps.event.addListener(marker, "click", function() {
alert("my code");
});
return marker;
}
工作示例