我运行多个AJAX调用,以下载大量的谷歌地图的图标。 当我尝试递增标记聚类器,然而,地图清除所有标记。 我相信这是因为我打电话var markerCluster = new MarkerCluster(map);
在每个AJAX调用。
谁能告诉我如何正确地实现这一点?
var populateMapByIncident = function(incident, page) {
var run_again = false;
$.getJSON(
"/public_map_ajax_handler",
{"shortname" : incident, "page": page},
function(sites_list) {
if (sites_list.length > 2) {
run_again = true;
}
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(40.6501038, -73.8495823),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
var markers = [];
var i = 0;
for (var i = 0; i < sites_list.length; i++) {
var latLng = new google.maps.LatLng(sites_list[i].latitude, sites_list[i].longitude);
var marker = new google.maps.Marker({'position': latLng,
'icon': getMarkerIcon(sites_list[i]),
'site_id': sites_list[i].id,
'case_number': sites_list[i].case_number,
'work_type': sites_list[i].work_type,
'floors_affected': sites_list[i].floors_affected,
'status': sites_list[i].status});
markers.push(marker);
var site_id = sites_list[i].id;
google.maps.event.addListener(marker, "click", function() {
new Messi('<p>Name, Address, Phone Number are removed from the public map</p><p>Details: work type: '
+ this.work_type+ ', floors affected: ' + this.floors_affected + '</p>' + '<p>Status: ' + this.status + '</p>',
{title: 'Case Number: ' + this.case_number, titleClass: 'info',
buttons: [
{id: 0, label: 'Printer Friendly', val: "On the live version, this would send all of this site's data to a printer friendly page." },
{id: 1, label: 'Change Status', val: "On the live version, you would be able to change the site's status here."},
{id: 2, label: 'Edit', val: "On the live version, you would be able to edit the site's info, as new details come in."},
{id: 3, label: 'Claim', val: "On the live version, clicking this button would 'Claim' the site for your organization, letting other organizations know that you intend to work on that site"},
{id: 4, label: 'Close', val: 'None'}], callback: function(val) { if (val != "None") {Messi.alert(val);} }});
});
}
var markerCluster = new MarkerClusterer(map);
markerCluster.addMarkers(markers);
if (run_again == true) {
populateMapByIncident(incident, page + 1, markers);
} else {
markerCluster.addMarkers(markers);
}
}
);
}