Google Maps API 加载缓慢，有很多标记

Question

我正在尝试使用 addMarker 函数在页面加载时加载大约 600 个 googlemap 标记。

页面需要很长时间才能加载。

在继续使用 addMarker 功能的同时，我可以做些什么来使其加载更快？

谢谢。

var map
var myLatlng = new google.maps.LatLng(35.9531719,14.3712201);
var markerBounds = new google.maps.LatLngBounds();
var markers = {};
	
function HomeControl(controlDiv, map) 
{
	google.maps.event.addDomListener(zoomout, "click", function() {
		
	   var currentZoomLevel = map.getZoom();
	   if(currentZoomLevel != 0)
	   {
		 map.setZoom(currentZoomLevel - 1);
	   }     
	});
	
	google.maps.event.addDomListener(zoomin, "click", function() {
		
	   var currentZoomLevel = map.getZoom();
	   if(currentZoomLevel != 21)
	   {
		 map.setZoom(currentZoomLevel + 1);
	   }
	});
}

function initialize() 
{
  var googleMapOptions = {
    center: new google.maps.LatLng(35.9531719,14.3712201),
	zoom: 11,
	mapTypeId: google.maps.MapTypeId.ROADMAP,
	zoomControl: false,
	streetViewControl: false,
	panControl: false,
	draggable: true
  };

  map = new google.maps.Map(document.getElementById("map-canvas"), googleMapOptions);
  
  	google.maps.event.addListener(map, "idle", function() {
  		addMarker(latitude,longitude,id,'Title','url');
  	}); 
  
  var homeControlDiv = document.createElement("div");
  var homeControl = new HomeControl(homeControlDiv, map);
}

 var infowindow = new google.maps.InfoWindow({
    	content: ""
	});

 function addMarker(lat,long,id,desc,url) 
 {	
	var myIcon = new google.maps.MarkerImage("/images/pips/"+id+".png", null, null, null, new google.maps.Size(28,38));
 
    var myLatlng = new google.maps.LatLng(lat,long);

	var marker = new google.maps.Marker({
		map: map,
		title: desc,
		position: myLatlng,
		icon: myIcon,						
		id: id
	});
	
	google.maps.event.addListener(marker, 'click', function() {
		infowindow.setContent('<a href="' + url + '">' + desc + '</a>');
		infowindow.setPosition(marker.getPosition());
		infowindow.open(map, marker); 
	});
	
	markers[id] = marker;

	markerBounds.extend(myLatlng);
	
	google.maps.event.addListener(marker, "click", function() {
		infowindow.open(map,marker);
	});
 }	
 
 google.maps.event.addDomListener(window, "load", initialize);
</script>

Answer 1

您可以使用clustering，它将相邻标记合二为一，仅在缩放时展开

您可以在客户端和服务器端进行聚类，具体取决于标记的数量...

如果数量超过 4000，我建议使用服务器集群，否则客户端应该看起来不错