MarkerClusterer не се появява в моята карта - google-maps, google-maps-api-3, карти, маркери на google-maps, markerclusterer

Опитвам се да постигна това, защо не мога да го получа с това. Опитах това да сложа маркерите си в масив, тъй като можете да намерите моите var markers се дефинира като масив и накрая се опитах да го изведа с помощта var mc = new MarkerClusterer(map, markers);

Това използвах за справка http://gmaps-utility-library.googlecode.com/svn/trunk/markerclusterer/1.0/docs/examples.html

Където е споменато:

След като създадете маркерен клъстер, ще искате да добавите маркери към него. MarkerClusterer поддържа добавяне на маркери чрез метода addMarkers () или чрез предоставяне на масив от маркери на конструктора:

JS Fiddle: http://jsfiddle.net/24wfR/

По-долу е споменат моят код за постигане на това

function createMarker(latlng, i, tran_store_id) {
var storeMarker = new google.maps.MarkerImage(Drupal.settings.store.module_path + "/images/marker.png", new google.maps.Size(50, 60), new google.maps.Point(0, 0), new google.maps.Point(0, 50));
var marker = new MarkerWithLabel({
position: latlng,
icon: storeMarker,
map: map,
draggable: false,
raiseOnDrag: false,
labelContent: (i + 1),
labelAnchor: new google.maps.Point(0, 40),
labelClass: "store-custom-labels label_" + (i) + "_no",
// the CSS class for the label
labelInBackground: false
});
marker.set("id", i);
//console.log(Drupal.settings.store.themepopup[tran_store_id]);
var myOptions = {
content: Drupal.settings.store.themepopup[tran_store_id],
disableAutoPan: false,
maxWidth: 0,
pixelOffset: new google.maps.Size(-142, -379),
zIndex: null,
boxStyle: {
width: "500px"
},
closeBoxMargin: "6px -161px 0px 0px",
closeBoxURL: Drupal.settings.store.module_path + "/images/close.gif",
infoBoxClearance: new google.maps.Size(1, 1),
isHidden: false,
pane: "overlayMouseTarget",
enableEventPropagation: false
};
var ib = new InfoBox(myOptions);
google.maps.event.addListener(marker, "click", function (e) {
google.maps.event.trigger(map, "click");
for (var i = 0; i < totalMarkerCount; i++) {
var giconsc = new google.maps.MarkerImage(Drupal.settings.store.module_path + "/images/marker.png", new google.maps.Size(50, 60), new google.maps.Point(0, 0), new google.maps.Point(0, 50));
markers[i].setIcon(giconsc);
jQuery(".label_" + i + "_no").css("color", "#ffffff");
}
var val = marker.get("id");
jQuery("div.search-result-item").removeClass("active");
jQuery("#" + val).addClass("active");
jQuery(".label_" + val + "_no").css("color", "#ffffff");
var gicons = new google.maps.MarkerImage(Drupal.settings.store.module_path + "/images/marker.png", new google.maps.Size(50, 60), new google.maps.Point(55, 0), new google.maps.Point(0, 50));
marker.setIcon(gicons);
ib.open(map, marker);
});
google.maps.event.addListener(marker, "mouseover", function () {
var val = marker.get("id");
if (!jQuery("#" + val).hasClass("search-result-item active")) {
jQuery(".label_" + val + "_no").css("color", "#ffffff");
}
});
google.maps.event.addListener(marker, "mouseout", function () {
var val = marker.get("id");
if (!jQuery("#" + val).hasClass("search-result-item active")) {
var gicons = new google.maps.MarkerImage(Drupal.settings.store.module_path + "/images/marker.png", new google.maps.Size(50, 60), new google.maps.Point(0, 0), new google.maps.Point(0, 50));
marker.setIcon(gicons);
jQuery(".label_" + val + "_no").css("color", "#ffffff");
}
});
google.maps.event.addListener(ib, "closeclick", function () {
ib.close();
var val = marker.get("id");
jQuery("#" + val).removeClass("active");
jQuery(".label_" + i + "_no").css("color", "#ffffff");
var gicons = new google.maps.MarkerImage(Drupal.settings.store.module_path + "/images/marker.png", new google.maps.Size(50, 60), new google.maps.Point(0, 0), new google.maps.Point(0, 50));
marker.setIcon(gicons);
});
google.maps.event.addListener(map, "click", function () {
ib.close();
var val = marker.get("id");
jQuery("#" + val).removeClass("active");
jQuery(".label_" + i + "_no").css("color", "#ffffff");
var gicons = new google.maps.MarkerImage(Drupal.settings.store.module_path + "/images/marker.png", new google.maps.Size(50, 60), new google.maps.Point(0, 0), new google.maps.Point(0, 50));
marker.setIcon(gicons);
});
markers.push(marker);
var mc = new MarkerClusterer(map, markers);
}

Отговори:

Кредитът отива Анто Юркович

Отговорът беше доста ясен и много благодаря за това!

създавам струпване след за контур който призовава createMarker () функция. Следователно аз направих същото, наречено the var mc = new MarkerClusterer(map, markers); точно след като моят контур завърши там, където съм се обадил на createMarker()

for (var i = 0; i < markerNodes.length; i++) {
name = markerNodes[i].getAttribute("name");
address = markerNodes[i].getAttribute("address");
latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")), parseFloat(markerNodes[i].getAttribute("lng")));
timings = markerNodes[i].getAttribute("timings");
size = markerNodes[i].getAttribute("size");
phone = markerNodes[i].getAttribute("phone");
getaddress = markerNodes[i].getAttribute("getaddress");
tran_store_id = markerNodes[i].getAttribute("tran_store_id");
sidebar_entry = "<div id=" + i + " class="contact_content"><div class="top"><em>" + markerNodes[i].getAttribute("name") + "</em><br /> " + address + "</div>";
if (phone != "") {
sidebar_entry = sidebar_entry + "<div class="btm"> " + phone + "</div>";
}
sidebar_entry = sidebar_entry + "</div>";
jQuery("#stores_list").append(sidebar_entry);
createMarker(latlng, i, tran_store_id);
bounds.extend(latlng);
var viewlist = document.getElementById(i);
viewlist.onclick = function () {
selectMarker(this.id);
jQuery("#stores_list.div").removeClass("active");
jQuery(this).addClass("active");
};
totalMarkerCount = i;
j++;
}
var mc = new MarkerClusterer(map, markers);