重叠标记谷歌地图

我需要把我的制图数据库。我设置了表格和页面，以便正确获取坐标和功能，以及地图的视野。现在有8000多条记录在相同的坐标中。我如何创建重叠？重叠标记谷歌地图

<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>Mappa Veicoli</title> 
<script src="https://maps.googleapis.com/maps/api/js?     
     key=xxxxxxxxxxxxxxx" 
     type="text/javascript"></script> 

<script type="text/javascript"> 
//<![CDATA[ 

var customIcons = { 
    FRANCIA: { 
    icon: '../immig/bandiere/blue_MarkerA.png' 
    }, 
    GERMANIA: { 
    icon: './immig/bandiere/pink_MarkerA.png' 
    }, 
    USA: { 
    icon: '../immig/bandiere/darkgreen_MarkerA.png' 
    } 
    , 
    SPAGNA: { 
    icon: '../immig/bandiere/green_MarkerA.png' 
    } 
}; 

function load() { 
    var map = new google.maps.Map(document.getElementById("map"), { 
    center: new google.maps.LatLng(12.444, 14.2), 
    zoom: 13, 
    mapTypeId: 'roadmap' 
    }); 
    var infoWindow = new google.maps.InfoWindow; 

    // Change this depending on the name of your PHP file 
    downloadUrl("xmleicoli.php", function(data) { 
    var xml = data.responseXML; 
    var markers = xml.documentElement.getElementsByTagName("marker"); 
    for (var i = 0; i < markers.length; i++) { 
     var cognome = markers[i].getAttribute("Cognome"); 
     var nome = markers[i].getAttribute("Nome"); 
     var type = markers[i].getAttribute("Nazione"); 
     var address = markers[i].getAttribute("Residenza"); 

     var point = new google.maps.LatLng( 
      parseFloat(markers[i].getAttribute("lat")), 
      parseFloat(markers[i].getAttribute("lng"))); 
     var html = "<b>" + cognome + "," + nome + "</b> <br/>" +  
      address; 
     var icon = customIcons[type] || {}; 
     var marker = new google.maps.Marker({ 
     map: map, 
     position: point, 
     icon: icon.icon 
     }); 
     bindInfoWindow(marker, map, infoWindow, html); 
    } 
    }); 
      } 

    function bindInfoWindow(marker, map, infoWindow, html) { 
    google.maps.event.addListener(marker, 'click', function() { 
    infoWindow.setContent(html); 
    infoWindow.open(map, marker); 
    }); 
    } 

    function downloadUrl(url, callback) { 
    var request = window.ActiveXObject ? 
     new ActiveXObject('Microsoft.XMLHTTP') : 
     new XMLHttpRequest; 

    request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
     request.onreadystatechange = doNothing; 
     callback(request, request.status); 
    } 
    }; 

    request.open('GET', url, true); 
    request.send(null); 
} 

    function doNothing() {} 

//]]> 

</script> 

</head> 

<body onload="load()"> 
<div id="map" style="width: 1200px; height:800px"></div> 
</body> 

    </html>

来源

2015-11-19 lelemkop

'function doNothing（）{}' - why？ – duncan

当请求完成时，它由'downloadUrl'函数使用。 – geocodezip

在这种情况下，你需要稍微每个标记，以便它们不会相互重叠和用于移动显示，有更多的标记分组，您可以使用一个标记群集，您可以看到在StackOverflow的

许多例子

对于标记yuo可以设置位置在lat，lng中的小差异，例如，在同一原始位置为每个标记添加+ 0.00001

来源

2015-11-19 16:20:22 scaisEdge

感谢您的回答，我试着加入0.000001，但标记太靠近，不容易区分。我找到OverlappingMarkerSpiderfier，但不明白如何实现代码。 – lelemkop

0.00001不0.000001一个零点以下。否则这些标记太接近，或0.00005，如果结果更好。 – scaisEdge

我也尝试添加0.00010，但差别很小，因为它们大约有8000条记录，所以我认为OverlappingMarkerSpiderfier – lelemkop

重叠标记谷歌地图

回答

相关问题