Mapy Google Wiele znaczników o tej samej lokalizacji Nie działa

Question

Jul 17, 2013, 09:10 PM

google-maps-api-3 google-maps-markers google-maps

Mapy Google Wiele znaczników o tej samej lokalizacji Nie działa

Chcę sprawdzić, czy któryś z istniejących znaczników pasuje do nowego znacznika, a jeśli tak, połącz okno informacyjne / tekst podpowiedzi.

Oto, co próbowałem zrobić:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title></title>
<script type="text/javascript"  src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclustererplus/src/markerclusterer.js"></script>


<script type="text/javascript"> 
var map;
var mc;//marker clusterer
var mcOptions = {gridSize: 10, maxZoom: 8};
var infowindow = new google.maps.InfoWindow();//global infowindow
var geocoder = new google.maps.Geocoder(); //geocoder
var address = new Array("42.3334,-89.1572",
"39.2058,-76.7531",
"39.7751,-86.1322",
"40.4894,-78.3499",
"42.0203,-87.9059",
"36.2673,-86.2912",
"33.6115,-84.3745",
"44.9793,-93.273",
"40.1461,-76.0738",
"32.2911,-90.1927",
"32.9315,-96.6158",
"36.0553,-79.8317",
"41.8397,-88.0887",
"47.8029,-103.267",
"34.106,-83.589",
"41.5907,-87.3199",
"43.0905,-74.3554",
"40.3438,-74.4289",
"40.8651,-96.8231",
"40.8651,-96.8231",
"41.759,-88.1524",
"38.2512,-86.8675",
"41.8119,-87.6873",
"41.3651,-89.0866",
"25.7791,-80.1978",
"41.6404,-88.0696",
"41.7684,-88.1366",
"39.7299,-86.4234",
"41.5234,-81.5996",
"41.6233,-88.0225",
"41.0171,-80.8029",
"40.2899,-82.9811",
"41.8119,-87.6873",
"32.3445,-99.8021",
"41.8119,-87.6873",
"29.8131,-95.3098",
"35.1693,-89.9904",
"33.6115,-84.3745",
"47.7374,-103.298",
"46.3502,-94.1",
"41.9907,-88.4298",
"35.3716,-80.5621",
"38.189,-85.6768",
"41.8119,-87.6873",
"32.7714,-97.2915");
var content = new Array("UnitNo1",
"UnitNo2",
"UnitNo3",
"UnitNo4",
"UnitNo5",
"UnitNo6",
"UnitNo7",
"UnitNo8",
"UnitNo9",
"UnitNo10",
"UnitNo11",
"UnitNo12",
"UnitNo13",
"UnitNo14",
"UnitNo15",
"UnitNo16",
"UnitNo17",
"UnitNo18",
"UnitNo19",
"UnitNo20",
"UnitNo21",
"UnitNo22",
"UnitNo23",
"UnitNo24",
"UnitNo25",
"UnitNo26",
"UnitNo27",
"UnitNo28",
"UnitNo29",
"UnitNo30",
"UnitNo31",
"UnitNo32",
"UnitNo33",
"UnitNo34",
"UnitNo35",
"UnitNo36",
"UnitNo37",
"UnitNo38",
"UnitNo39",
"UnitNo40",
"UnitNo41",
"UnitNo42",
"UnitNo43",
"UnitNo44",
"UnitNo45");

//min and max limits for multiplier, for random numbers //keep the range pretty small, so markers are kept close by
var min = .999999;
var max = 1.000001;

function createMarker(latlng,text) {

var marker = new google.maps.Marker({
position: latlng,
                map: map
});

                ///get array of markers currently in cluster
                var allMarkers = mc.getMarkers();

                //check to see if any of the existing markers match the latlng of the new marker
                if (allMarkers.length != 0) {
                for (i=0; i < allMarkers.length; i++) {
                var existingMarker = allMarkers[i];
                var pos = existingMarker.getPosition();

                if (latlng.equals(pos)) {
                text = text + " & " + content[i];
                }                   
                }
                }
// WHERE TO ADD: mc.addMarker(marker); //??

google.maps.event.addListener(marker, 'click', function() {
infowindow.close();
infowindow.setContent(text);
infowindow.open(map,marker);
});
return marker;
}

function initialize(){
var options = { 
zoom: 4, 
center: new google.maps.LatLng(39.8282,-98.5795), 
mapTypeId: google.maps.MapTypeId.ROADMAP 
};
map = new google.maps.Map(document.getElementById('map'), options); 

var gmarkers = [];
for (i=0; i<address.length; i++) {
var ptStr = address[i];
var coords = ptStr.split(",");
var latlng = new google.maps.LatLng(parseFloat(coords[0]),parseFloat(coords[1]))
gmarkers.push(createMarker(latlng,content[i]));
}

//marker cluster
mc = new MarkerClusterer(map, gmarkers, mcOptions);
for (i=0; i<address.length; i++) { 
geocodeAddress(address[i],i);

}
}
</script> 
<style>
html, body, #map {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  }
</style>
</head>
<body onload="initialize();">
<div id="map"></div>
</body>
</html>

Zmęczyłem się, aby znaleźć ten działający przykład tutajhttp://www.geocodezip.com/SO_OverQueryLimitB.html i dodaj do niego następujący kod:

        ///get array of markers currently in cluster
        var allMarkers = mc.getMarkers();

        //check to see if any of the existing markers match the latlng of the new marker
        if (allMarkers.length != 0) {
        for (i=0; i < allMarkers.length; i++) {
        var existingMarker = allMarkers[i];
        var pos = existingMarker.getPosition();

        if (latlng.equals(pos)) {
        text = text + " & " + content[i];
        }                   
        }
        }

Aby ostateczny wynik po kliknięciu znacznika o tym samym opóźnieniu wyświetlał jedno okno informacyjne ze scalonym tekstem, takim jak ten znaleziony tutajhttp://maps.caseypthomas.org/ex/MarkerClustererPlus/exCoincidentMarkers_SharedInfowindow_wGeocoding.html Zobacz, że pokazuje liczbę 4, ale wyświetla tylko 3 znaczniki, ponieważ ten po prawej stronie jest scalony z innym za nim, a po jego kliknięciu wyświetla tekst dla obu. tylko chciałbym użyć przykładu geocodezip i pracować nad tym, ponieważ mam już kable i nie potrzebuję google, aby je zdobyć. Dziękuję za przeczytanie tego DŁUGIEGO pytania, jeśli zauważysz coś innego ..

i dziękuję 1Dalej X, jeśli możesz mi pomóc znaleźć rozwiązanie.

Dzięki jeszcze raz!!!