MarkerClusterer没有错误,但什么也没做

时间:2016-10-05 06:49:58

标签: javascript google-maps google-maps-markers markerclusterer

页面加载,标记设置和显示,功能工作等等...... 一切似乎都很好,但MarkerClusterer不起作用。 我错过了什么? 我们也欢迎代码优化建议:)

<script>

var map;
var markers = [];

function loadjsonmarkerstomap()
	{
	$.getJSON("json.php", function(json1)
		{
		$.each(json1, function(key, data)
			{
			var latlng = new google.maps.LatLng(data.lat, data.lng);
			var infocontent = "<div style='width: 200px; height: 200px; border: 1px solid grey;'>ID: " + data.id + "<br/>Type: " + data.type + "<br/>Weight: " + data.weight + '<br/><input type="submit" value="Show"/></div>';
			var marker = new google.maps.Marker(
				{
				position: latlng,
				map: map,
				title: data.title
				});
			var infowindow = new google.maps.InfoWindow({ content: infocontent });
			marker.addListener('click', function()
				{
				infowindow.open(map, marker);
				});
			markers.push(marker);
			});
		});
	
	}

function clearLocations()
	{
	for (var i = 0; i < markers.length; i++)
		{
		markers[i].setMap(null);
		}
		markers.length = 0;
	}

$('#clear').click(
	function()
		{
		clearLocations();
		}
	);
	
$('#load').click(
	function()
		{
		loadjsonmarkerstomap();
		}
	);


function initMap()
	{
	map = new google.maps.Map(document.getElementById('map'),
		{
		center: {lat: 46.30499, lng: 25.292647}, //
		zoom: 8 //
		});

	loadjsonmarkerstomap(); //
	
	var markerCluster = new MarkerClusterer(map, markers, {imagePath: 'images/m'});

	}
	


</script>

1 个答案:

答案 0 :(得分:1)

我认为由于标记是异步获取的,它可能无法正常工作。例如,当您运行loadjsonmarkerstomap()然后立即初始化群集时,您的标记数组仍为空。

在ajax调用成功后,您必须确保初始化群集。

var markerCluster = new MarkerClusterer(map, markers, {imagePath: 'images/m'}); }

应该进入你的ajax调用的回调。例如,直接在$.each(json1.. loop

之后