标记聚类在缩小时不聚类
Marker clustering not clustering on zoom out
我有一个 100000 的数据集,我在获取数据时发送了 10000 个的补丁,我添加了标记并重新绘制了集群,所以最后我得到了一个 100000 的集群。但是一旦我缩放放大并尝试再次缩小它们以 10000 个块的形式重叠,而不是改造 100000 个的单个集群。
var mapDiv = document.getElementById('newmap');
map = new google.maps.Map(mapDiv, {
center: new google.maps.LatLng(latitude, longitude),
zoom: 3,
panControl: true,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
zoomControl: true,
zoomControlOptions: {
position: google.maps.ControlPosition.LEFT_TOP,
},
streetViewControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
function addMarker1(locations,outletname,outletData)
{
var infoWindow = new google.maps.InfoWindow();
markers = locations.map(function(location, i)
{
return new google.maps.Marker
({
position: location,
});
});
markerCluster = new MarkerClusterer(map, markers,{imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
new_arr=new_arr.concat(markers);
markerCluster.clearMarkers()
markerCluster.addMarkers(new_arr);
markerCluster.redraw();
}
// this is sending data 10000 each
for (var i = 0; i < outletDataLen; i++) {
outletArray.push(outletData[i]['Outletview']['name']);
j.push({
lat: parseFloat(outletData[i]['Outletview']['latitude']),
lng: parseFloat(outletData[i]['Outletview']['longitude'])
});
outletname.push(outletData[i]['Outletview']['name']);
}
addMarker1(j, outletname, outletData);
解决方法是在循环遍历标记之前清除数据
if (markerCluster)
{
markerCluster.clearMarkers();
markerCluster.resetViewport();
markers = [];
markerCluster.removeMarker(new_arr);
}
我有一个 100000 的数据集,我在获取数据时发送了 10000 个的补丁,我添加了标记并重新绘制了集群,所以最后我得到了一个 100000 的集群。但是一旦我缩放放大并尝试再次缩小它们以 10000 个块的形式重叠,而不是改造 100000 个的单个集群。
var mapDiv = document.getElementById('newmap');
map = new google.maps.Map(mapDiv, {
center: new google.maps.LatLng(latitude, longitude),
zoom: 3,
panControl: true,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
zoomControl: true,
zoomControlOptions: {
position: google.maps.ControlPosition.LEFT_TOP,
},
streetViewControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
function addMarker1(locations,outletname,outletData)
{
var infoWindow = new google.maps.InfoWindow();
markers = locations.map(function(location, i)
{
return new google.maps.Marker
({
position: location,
});
});
markerCluster = new MarkerClusterer(map, markers,{imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
new_arr=new_arr.concat(markers);
markerCluster.clearMarkers()
markerCluster.addMarkers(new_arr);
markerCluster.redraw();
}
// this is sending data 10000 each
for (var i = 0; i < outletDataLen; i++) {
outletArray.push(outletData[i]['Outletview']['name']);
j.push({
lat: parseFloat(outletData[i]['Outletview']['latitude']),
lng: parseFloat(outletData[i]['Outletview']['longitude'])
});
outletname.push(outletData[i]['Outletview']['name']);
}
addMarker1(j, outletname, outletData);
解决方法是在循环遍历标记之前清除数据
if (markerCluster)
{
markerCluster.clearMarkers();
markerCluster.resetViewport();
markers = [];
markerCluster.removeMarker(new_arr);
}