サーバーに Ajax リクエストを実行し、多くの緯度、経度値を含む xml 応答を取得しました。これらの値をループし、各マーカーをラベル付きでマップに追加します。ajax のリクエストとレスポンスがすばやく発生し、各マーカーがすばやくマップに追加されます。その後、ページ全体がしばらくフリーズします。その後、マーカーは大きく表示され、通常の状態になります。なぜGoogleマップはこのようにするのですか？
ajaxリクエスト、レスポンス、マップ上のマーカーを追加するための私のコード:
ajaxRequests[ax]=$.ajax({
type: "GET",
url: "myurl",
dataType: "xml",
async:true,
success: function(xml) {
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(null);
}
}
routepoints = new Array();
$(xml).find('value').each(function(){
var latt=$(this).find('lat').text();
var lonn=$(this).find('lon').text();
routepoints[i] = new Array(name,ct,latt,lonn,phone);
addMarker(i);
i=i+1;
});
mzoom=map.getZoom();
}
});
function addMarker(tt)
{
var icont;
if(tt==0)
icont='images/green.png';
else if(tt==(total_markers-1))
icont='images/red.png';
else
icont='images/purple.png';
var idm=(tt+1)+") "+routepoints[tt][1];
var clocation= new google.maps.LatLng(routepoints[tt][2],routepoints[tt][3]);
var marker = new MarkerWithLabel({
position: clocation,
map: map,
labelContent: idm,
labelAnchor: new google.maps.Point(15, 5),
labelClass: "labels",
icon: icont
});
if(tt==0 || (tt+1)==total_markers)
marker.setAnimation(google.maps.Animation.BOUNCE);
else
marker.setAnimation(google.maps.Animation.DROP);
markersArray.push(marker);
map.panTo(clocation);
}