直到地图轻微移动或单击后才会显示标记答案

【问题标题】：Markers not showing until map moved slightly or clicked直到地图轻微移动或单击后才会显示标记
【发布时间】：2014-01-18 15:05:58
【问题描述】：

我的（减少的）代码如下。在我单击或稍微移动地图之前，我的标记不会显示...有什么办法可以解决这个问题，让它们立即显示？

<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>TSF - Labour Plan </title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">     </script>
<script type="text/javascript">
function initialize() {
    var centerlatlng = new google.maps.LatLng(53.644638, -2.526855);
    var myOptions = {
        zoom: 6,
        center: centerlatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var latlng = new google.maps.LatLng(51.752927, -0.470095);
    var img = "https://dl.dropboxusercontent.com/u/55888592/tsf-logo.gif";
    var info = "<img style = 'float: left' src='http://www.tsf.uk.com/wp-content/themes/default/images/tsf-logo.gif'><div style = 'float: right; width: 200px'><p><b>Job Number:</b> </p><p><b>Client:</b> ASDA</p><p><b>Location:</b> HEMEL HEMPSTEAD</p><p><b>Postcode:</b> HP2 4AA</p><p><b>Start Time:</b> 22:0</p><p><b>No of Men:</b> 10.0</p><p><b>Allocated Labour:</b> AB: 5.0, WK: 5.0, : , : , : , : </p><p><b>Job Information: </b>PICK UP TOOLS</div>";
    var infowindow = new google.maps.InfoWindow({
    });
    var marker = new google.maps.Marker({
    icon: img,
    position: latlng,
    map: map,
    content: info
    });
    marker.setMap(map);

    google.maps.event.addListener(marker, "click", function(content) {
        infowindow.setContent(this.content);
        infowindow.open(map,this);
    });
}
google.maps.event.addDomListener(window, "load", initialize);
</script>
</head>
<body style="margin:0px; padding:0px;" onload="initialize()">
<div id="map_canvas" style="width: 100%; height: 100%;"></div>
</body>
</html>

【问题讨论】：

您调用了两次initialize，一次是DomListener，一次是body onload。我会删除body onload 电话。看看是否有帮助。我还会将您的 javascript 从头部移到身体中。在本地，我没有任何问题。
我试过了，但没有运气。我刚刚在资源管理器中检查了它，它工作正常，所以这个问题似乎与 chrome 有关？我可以在网上找到的唯一类似问题是：groups.google.com/forum/#!topic/google-maps-api/jLsVUoF9-Zk
我在 Mac 上的 Chrome 中没有任何问题。也许是因为缺少 DOCTYPE？在文件顶部添加<!DOCTYPE HTML>。
你是如何简化代码的？你看到这个版本的问题了吗？您使用的是 MarkerClusterer 还是 MarkerManager（在未缩减的版本中）？
我的完整代码只是有更多标记，是的，我遇到了这个版本的问题。不，我没有使用 markerclusterer 或 markermanager。

标签： javascript google-maps google-maps-api-3 google-maps-markers

【解决方案1】：

在google map api和marker cluster js的最新版本中，google chrome似乎仍然存在问题。

所以我将发布对我有帮助的代码。

google.maps.event.addListener(map, 'zoom_changed', function() {
    setTimeout(function() {
        var cnt = map.getCenter();
        cnt.e+=0.000001;
        map.panTo(cnt);
        cnt.e-=0.000001;
        map.panTo(cnt);
    },400);
});

随意使用 400 的间隔值（在我的情况下，小于 400 不会解决问题，但更高的值 - 更高的延迟时间）

附：确保您已定义地图变量：

map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

【讨论】：

谢谢。为我工作。您在 Google 上看到过有关此问题的错误列表帖子吗？
我在使用 100 多个标记时遇到了同样的问题。 PC 浏览器上缺少一些标记，但在移动设备上更多。我发现在地图上模拟任何导致它移动的用户操作修复了它。与您的代码基本相同。
Op 需要改变他对这个问题的答案...... setTimeout 和轻微的 panTo 和 back 绝对是答案。将其放入我遇到此问题的代码中，并且已修复。

【解决方案2】：

我正在为完全相同的问题而苦苦挣扎，很高兴听到其他人也有同样的问题。我在 Safari 和 Firefox 中也遇到了 GMaps V3 的问题。我尝试了您的解决方案，它也适用于我，但我使用空闲事件而不是超时：

google.maps.event.addListener(map, 'idle', function(event) {
    var cnt = map.getCenter();
    cnt.e+=0.000001;
    map.panTo(cnt);
    cnt.e-=0.000001;
    map.panTo(cnt);
});

只需在初始化谷歌地图时添加它。使用绑定到标记的信息窗口和圆圈可能会出现另一个问题。就我而言，我可以在信息框中设置圆的半径。跳出输入字段（更改或不更改半径值）会使红色标记变为蓝色。如果然后放大/缩小原始颜色会重新出现。要解决此问题，您必须快速更改缩放级别（在 radius_changed 事件中）：

map.setZoom(map.getZoom()-1);
map.setZoom(map.getZoom()+1);

【讨论】：

【解决方案3】：

我已经两次解决了对 markerclusterer 变量的调用 repaint：

mc.repaint();
map.fitBounds(bounds); // for centering within the marker bounds
mc.repaint(); // repaint for getting it fixed

希望这对仍然面临该问题的人有所帮助。

【讨论】：

这很简单，对我有用。不过，我将不得不密切关注地图是否有任何副作用：D

【解决方案4】：

根据 Geocodezips 的评论，这似乎是一个本地问题。

【讨论】：

“本地问题”可能发生在任何地方。您是如何解决问题的？原因可能是什么？
我没有，但它不会发生在 IE 中，这是我将主要使用它的地方......如果它没有发生在其他人的 Chrome 中，那一定是我这边的问题.