Как добавить маркерный кластер в google maps v3 для одного и того же lat/long без влияния на другой элемент?

Question

Я сделал traceroute карту. И у меня проблема с некоторыми маркерами, которые должны быть в одном и том же lat/long, но только на одном маркерном экране. Я читал, что есть способ сделать это. Это маркерный кластер. но я не знаю, как добавить в javascript. Также я боюсь, если бы это повлияло на еще один элемент маркеров, который я добавляю как пользовательский маркер с меткой, infowindow и полилинией. вот мой код:

<script type="text/javascript"> 
    var pinImage = new google.maps.MarkerImage ("http://chart.apis.google.com/chart?chst=d_map_xpin_letter_withshadow&chld=pin_star|%E2%80%A2|CC3300|000000|FF9900", 
     new google.maps.Size (70, 83), 
     new google.maps.Point (0,0), 
     new google.maps.Point (10,34)); 
    var pinShadow = new google.maps.MarkerImage ("http://chart.apis.google.com/chart?chst=d_map_pin_shadow", 
     new google.maps.Size (89, 85), 
     new google.maps.Point (0, 0), 
     new google.maps.Point (12, 35)); 

    function initialize() { 
    var myLatlng = new google.maps.LatLng(38.822591, 150.46875); 
    var myOptions = { 
    zoom: 2, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    } 
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    <?php 
    $posisi = array(); 
    $keterangan = array(); 
    foreach ($integer as $lokasi) { 
    $query = "SELECT cl.locId, cl.country as country, cl.region as region, cl.city as city, cl.postalCode as postalCode, cl.latitude as latitude, cl.longitude as longitude, cl.metroCode as metroCode, cl.areaCode as areaCode 
    FROM (SELECT locId as idcihuy FROM cityblocks WHERE $lokasi BETWEEN startIpNum AND endIpNum) cb, citylocation cl WHERE cb.idcihuy = cl.locId"; 
    $result = mysql_query($query); 
    while ($location = @mysql_fetch_assoc($result)){ 
    $posisi[]= 'new google.maps.LatLng(' . $location['latitude'] . ', ' . $location['longitude'] . ')'; 
    $keterangan[]= '"(' . $location['country'] . ', ' . $location['region'] . ', ' . $location['city'] . ')"'; 
    } 
    } 
    ?> 
    var infoWindow = new google.maps.InfoWindow({}); 
    var point = [<?php echo implode(',', $posisi) ?>]; 
    var lokasi = [<?php echo implode(',', $keterangan) ?>]; 
    var icon = pinImage; 
    for (var i = 0; i < point.length; i++) { 
    var html = "<b>" + lokasi[i] + "</b> <br/>" + point[i]; 
    var marker = new MarkerWithLabel({ 
     map: map, 
     position: point[i], 
     icon: pinImage, 
     shadow: pinShadow, 
     labelContent: i, 
     labelAnchor: new google.maps.Point(12, -5), 
     labelClass: "labels" 
     }); 
     bindInfoWindow(marker, map, infoWindow, html); 
    var jalur = new google.maps.Polyline({ 
    path: point, 
    strokeColor: "#000000", 
    strokeOpacity: 0.8, 
    strokeWeight: 2.25 
    }); 
    jalur.setMap(map); 
     } 
     } 
    function bindInfoWindow(marker, map, infoWindow, html) { 
     google.maps.event.addListener(marker, 'click', function() { 
     infoWindow.setContent(html); 
     infoWindow.open(map, marker); 
     }); 
    } 
    </script> 

Также я даю вам образец позиций, которые имеют тот же широту/долготу:

[ 
new google.maps.LatLng(1.3667, 103.8000), 
new google.maps.LatLng(1.3667, 103.8000), 
new google.maps.LatLng(1.3667, 103.8000), 
new google.maps.LatLng(1.3667, 103.8000), 
new google.maps.LatLng(51.0000, 9.0000), 
new google.maps.LatLng(51.0000, 9.0000), 
new google.maps.LatLng(51.5142, -0.0931), 
new google.maps.LatLng(51.5142, -0.0931), 
new google.maps.LatLng(54.0000, -2.0000), 
new google.maps.LatLng(51.6000, -1.2500), 
new google.maps.LatLng(51.7500, -1.2500) 
]; 

мне нужна помощь, чтобы сделать кластер маркера для же широты/долготы но это не повлияло бы на другой элемент, такой как маркер с меткой, infowindow и полилинией. Пожалуйста помоги. Спасибо.

Answer 1

Вы можете использовать библиотеку this.

MarkerClusterer для Google Maps v3

Библиотека создает и управляет за увеличения уровня кластеров для больших количества маркеров.

Example

При увеличении масштаба на кластере вы можете увидеть несколько маркеров в одном месте.

EDIT:

// GET AN EMPTY ARRAY 
var markerArray = []; 
for (var i = 0; i < point.length; i++) { 

    // CODE AT THE BEGINNING OF LOOP 

    var marker = new MarkerWithLabel({ 
     // MARKER CONFIGS 
    }); 
    markerArray.push(marker); 

    // REST OF THE CODE IN LOOP 
} 

// TIME FOR ACTION 
var markerCluster = new MarkerClusterer(map, markerArray);