我有一个带有单个标记和单个infoBubble的谷歌地图。单击标记时出现信息。问题是信号灯出现在标记上,而不是在标记上。见截图:
infoBubble已关闭: infoBubble已打开: 这是代码,我使用地理编码器,因为我只有名为地址:
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var myOptions = {
zoom: 14,
center: results[0].geometry.location,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
//i am using simple InfoBubble initialization
var infoBubble = new InfoBubble(
{
map: map,
content: "<h2>"+name+"</h2><div>"+street+"</div><div>"+city+", "+zip+"</div>"
});
google.maps.event.addListener(marker, 'click', function(e) {
infoBubble.open(map,marker);
});
}
});
为什么会发生这种情况的任何线索?
答案 0 :(得分:2)
在创建infoBubble时省略map
- 选项。
答案 1 :(得分:0)
我发现此示例非常方便[http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/examples/example.html] [1],请尝试以下代码段。
var map, infoBubble;
function init() {
var mapCenter = new google.maps.LatLng(-35.397, 150.644);
map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: mapCenter,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(-35, 150),
draggable: true
});
infoBubble = new InfoBubble({
maxWidth: 300
});
infoBubble.open(map, marker);
infoBubble.setContent('This is a sample content') //Please set your content here.
google.maps.event.addListener(marker, 'click', function() {
if (!infoBubble.isOpen()) {
infoBubble.open(map, marker);
}
});
}
google.maps.event.addDomListener(window, 'load', init);
}
[1]: http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/examples/example.html