infoBubble错误定位在标记上

时间:2013-02-27 11:38:04

标签: google-maps-api-3 infobubble

我有一个带有单个标记和单个infoBubble的谷歌地图。单击标记时出现信息。问题是信号灯出现在标记上,而不是在标记上。见截图:

infoBubble已关闭: infoBubble is closed infoBubble已打开: infoBubble is open 这是代码,我使用地理编码器,因为我只有名为地址:

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);
            });

        }
    });

为什么会发生这种情况的任何线索?

2 个答案:

答案 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