谷歌地图在点击标记时消失

我在可点击的多段线和多边形上有一个信息框。谷歌地图在点击标记时消失

当我点击其中的任何一种无形的标记创建和infoxbox弹出它。

问题是，当infoxbox出现地图消失。

我没有得到任何javascript错误。

这是我的代码：（我注释掉所有infoxbox功能除了内容文本）

google.maps.event.addListener(mapObject, 'click', function(event) { 
     var invisibleMarker = new google.maps.Marker({ 
         position: new google.maps.LatLng(event.latLng), 
         map: map 
        }); 

    var boxText = document.createElement("div"); 
    boxText.style.cssText = "background: none; padding: 0;"; 
    boxText.innerHTML = '<div style="margin: 0 0 20px 0;padding: 18px;background: white url(/media/images/map-marker-info-bg.gif) repeat-x top left;">' + content[0] + '</div>'; 

     var myOptions = { 
      content: boxText 
          /*,latlng: event.latLng 
          ,alignBottom: true 
      ,pixelOffset: new google.maps.Size(-470, -20) 
      ,boxStyle: { 
       background: "transparent url('/media/images/map-marker-info-arrow.png') no-repeat bottom right" 
       ,opacity: 1 
       ,width: "470px" 
      } 
      ,closeBoxMargin: "18px 18px 2px 2px" 
      ,closeBoxURL: "/media/images/map-marker-info-close.gif" 
      ,infoBoxClearance: new google.maps.Size(5, 5) 
      ,enableEventPropagation: false*/ 
    }; 

    var ib = new InfoBox(myOptions); 
    ib.open(map, invisibleMarker); 

});

任何人可以帮助我解决这个问题？

谢谢

来源

2012-12-17 nickornotto

有几个问题：

1）google.maps.event.addListener(mapObject, 'click', function(event)

您没有提供地图创建代码，但是变量应该是一个地图对象...这不符合您对地图对象map的任何其他引用。

2）new google.maps.LatLng(event.latLng)

你并不需要解析event.LatLng价值，一切都已经经/纬度值。

这是一个工作示例，其中包含上面提到的更正。 InfoBox将输出undefined，因为content[0]未定义，但可以是您想要的任何有效文本。

<!DOCTYPE html> 
<html> 
<head> 
    <style type="text/css"> 
     html, body, #map_canvas { 
     margin: 0; 
     padding: 0; 
     height: 100%; 
     } 
    </style> 
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/src/infobox.js"></script> 
<script type="text/javascript"> 
    var map; 
function test() 
{ 
     var myOptions = { 
      zoom: 8, 
      center: new google.maps.LatLng(-34.397, 150.644), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 

google.maps.event.addListener(map, 'click', function(event) { 

     var invisibleMarker = new google.maps.Marker({ 
         position: event.latLng, 
         map: map 
        }); 

    var boxText = document.createElement("div"); 
    boxText.style.cssText = "background: none; padding: 0;"; 
    boxText.innerHTML = '<div style="margin: 0 0 20px 0;padding: 18px;background: white url(/media/images/map-marker-info-bg.gif) repeat-x top left;">' + content[0] + '</div>'; 

     var myOptions = { 
      content: boxText 
          /*,latlng: event.latLng 
          ,alignBottom: true 
      ,pixelOffset: new google.maps.Size(-470, -20) 
      ,boxStyle: { 
       background: "transparent url('/media/images/map-marker-info-arrow.png') no-repeat bottom right" 
       ,opacity: 1 
       ,width: "470px" 
      } 
      ,closeBoxMargin: "18px 18px 2px 2px" 
      ,closeBoxURL: "/media/images/map-marker-info-close.gif" 
      ,infoBoxClearance: new google.maps.Size(5, 5) 
      ,enableEventPropagation: false*/ 
    }; 

    var ib = new InfoBox(myOptions); 
    ib.open(map, invisibleMarker); 

}); 
} 
</script> 
</head> 
<body onload="test();"> 
    <div id="map_canvas"></div> 
</body> 
</html>

来源

2012-12-17 23:05:23 staticbeast

1）我的我发布的代码位于函数createInfoWindow（mapObject，content，objectType）中。 'mapObject'变量是被点击的标记，'map'是在函数上定义的地图对象。 2）InvisibleMarker替换了我测试的mapObject，函数现在使用'mapObject'。我认为这是个问题，尽管现在我不能像现在刚解决的那样记住它。内容是一个数组，因此content [0]是一个用作infoBox副本的字符串。无论如何感谢提示 – nickornotto

我知道是什么问题。我不应该根据2）new google.maps.LatLng（event.latLng）解析latlng值。它修复了地图的不足。我现在也使用隐形标记来显示工作正常的多段线上方的信息框。 t甚至修复了显示折线信息窗口的问题 - 我必须单击它3次才能显示标准信息窗口。感谢您的帮助 – nickornotto

我想为我的多段线使用类似样式的InfoBox，但需要传递点击位置，我认为。在原来简单的代码，它是

infowindow.setContent(content[0]); 
infowindow.position = event.latLng; 
infowindow.open(map);

和它的工作

我不知道如何做到这一点的信息框。我试着在信息框选择使用：

latlng: event.latLng

然后：

var ib = new InfoBox(myOptions); 
ib.setPosition(event.latLng); 
ib.open(map, mapObject);

，但我发现：

Error: anchor.getPosition is not a function

源文件：http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox.js

来源

2013-01-03 12:16:27 nickornotto

修复了隐形标记 - 根据我上面的评论 – nickornotto

谷歌地图在点击标记时消失

回答

相关问题