我正在尝试为我的google api添加自定义标记:工作正常,除非我点击该标记,我再也没有事件了:
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(0, 0), 5);
map.addControl(new GLargeMapControl3D());
map.addControl(new GMenuMapTypeControl());
var myIcon = new GIcon(G_DEFAULT_ICON);
myIcon.image = "http://farm3.staticflickr.com/2140/1911601567_49d97f3318.jpg";
myIcon.iconSize = new GSize(80, 60);
markerOptions={};
//markerOptions = { icon:myIcon }; // if I uncomment this : no click anymore
var bounds = map.getBounds();
var southWest = bounds.getSouthWest();
var northEast = bounds.getNorthEast();
var lngSpan = northEast.lng() - southWest.lng();
var latSpan = northEast.lat() - southWest.lat();
var point = new GLatLng(southWest.lat() + latSpan * Math.random(), southWest.lng() + lngSpan * Math.random());
var marker = new GMarker(point, markerOptions);
marker.html = 'hello world';
map.addOverlay(marker);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(marker.html);
})
如果我取消注释//markerOptions = { icon:myIcon };
我显示了我的照片,但我无法再点击标记了。
有人可以帮帮我吗?您可以在http://www.roulette-chat.fr/google.php上看到它。此致
答案 0 :(得分:1)
我会说使用api v3代替。您正在使用的是不推荐使用的。您可以使用下面的内容,将您自己的图像作为标记。要将标记设置为可点击,您需要使用属性clickable:true
<script type="text/javascript">
(function() {
window.onload = function(){
// Creating a LatLng object containing the coordinate for the center of the map
var latlng = new google.maps.LatLng(56.83, 15.16);
// Creating an object literal containing the properties we want to pass to the map
var options = {
zoom: 7,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
// Calling the constructor, thereby initializing the map
var map = new google.maps.Map(document.getElementById('map'), options);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(56.8848, 14.7730),
map: map,
title: 'My workplace',
clickable: true,
icon: 'url of your image' //this is a custom marker Image
});
}
})();
</script>
要添加操作,您必须添加eventListener
,如下所示:
google.maps.event.addListener(marker, 'click', function() {
//do some action
});