Мне нравится создавать карту с Google Maps, которая может обрабатывать большое количество маркеров (более 10.000). Чтобы не замедлить работу карты, я создал XML файл, который выводит только маркеры, находящиеся внутри текущего видового экрана.
Сначала я использую initialize() для настройки параметров карты:
function initialize() {
var myLatlng = new google.maps.LatLng(51.25503952021694,3.27392578125);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
google.maps.event.addListener(map, 'tilesloaded', function () {
loadMapFromCurrentBounds(map);
});
}
Когда событие "patchloaded" закончено, я использую loadMapFromCurrentBounds(), эти функции получат текущие границы и отправят запрос в XML файл, чтобы показать маркеры, которые находятся внутри текущего видового экрана:
function loadMapFromCurrentBounds(map) {
// First, determine the map bounds
var bounds = map.getBounds();
// Then the points
var swPoint = bounds.getSouthWest();
var nePoint = bounds.getNorthEast();
// Now, each individual coordinate
var swLat = swPoint.lat();
var swLng = swPoint.lng();
var neLat = nePoint.lat();
var neLng = nePoint.lng();
downloadUrl("mapsxml.php?swLat="+swLat+"&swLng="+swLng+"&neLat="+neLat+"&neLng="+neLng+"", function(data) {
var xml = parseXml(data);
var markers = xml.documentElement.getElementsByTagName("marker");
var infoWindow = new google.maps.InfoWindow;
for (var i = 0; i < markers.length; i++) {
var address = markers[i].getAttribute("address");
var type = markers[i].getAttribute("type");
var name = markers[i].getAttribute("name");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng"))
);
var html = "<b>" + name + "</b> <br/>" + address;
var icon = customIcons[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow});
bindInfoWindow(marker, map, infoWindow, html);
}
})
}
Это отлично работает, однако текущий код не разгружает маркеры, которые больше не находятся в окне просмотра. Кроме того, он снова загружает маркеры, которые уже загружены, что очень быстро замедляет работу карты при перемещении карты в режиме просмотра в той же области.
Поэтому, когда изменяется окно просмотра, мне нравится сначала очистить всю карту, прежде чем загружать новые маркеры. Каков наилучший способ сделать это?