0
我在使用JavaScript和xml文件繪製Google地圖中的700地址。使用html php xml繪製700地址標記到google地圖
所以這個JavaScript函數工作正常，直到300地址，它在地圖上正確繪製地址，但之後它會放慢並掛起html頁面。所以我們可以爲我提供更好的解決方案來實現在谷歌地圖中繪製所有地址。
這是xml示例文件，在該文件中有675個地址&文件名xml1.xml。例如。
<xml><listing>
<storename>Borges Architectural Group</storename>
<address>1478 Stone Point Dr # 350 Roseville CA 95661-2876 Placer</address>
<person>OWNER Lane Borges</person>
<phone>9167827200</phone>
<web>www.borgesarch.com</web>
<source>Infogroup</source>
</listing>
<listing>
<storename>Carrier Johnson Culture</storename>
<address>1301 3rd Ave San Diego CA 92101-4012 San Diego</address>
<person>PRESIDENT Michael C Johnson</person>
<phone>6192392353</phone>
<web>www.carrierjohnson.com</web>
<source>Infogroup</source>
</listing>
</xml>
所以我讀的JavaScript文件爲了這個，我做這一個功能來讀取XML內容並把它添加到地址的排列，所以在這裏我得到總675個地址，我路過一個由一個是谷歌地圖功能。所以這裏是JavaScript的。
<script type="text/javascript">
var addresses=new Array();
var info=new Array();
var infowindow = new google.maps.InfoWindow();
var latlng = new google.maps.LatLng(27.8333,-81.7170);
var mapOptions = {
zoom: 4,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var geo = new google.maps.Geocoder();
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
var bounds = new google.maps.LatLngBounds();
function getAddress(search,info1, next) {
geo.geocode({address:search}, function (results,status){
if (status == google.maps.GeocoderStatus.OK) {
var p = results[0].geometry.location;
var lat=p.lat();
var lng=p.lng();
var msg = 'address="' + search + '" lat=' +lat+ ' lng=' +lng+ ' <br>';
createMarker(search +"<br/>"+ info1,lat,lng);
}
else{
if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
nextAddress--;
}else {
var reason="Code "+status;
var msg = 'address="' + search + '" error=' +reason+ ' <br>';
}
}
next();
}
);
}
function createMarker(add,lat,lng) {
var contentString = add;
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat,lng),
map: map,
zIndex: Math.round(latlng.lat()*-100000)<<5
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(contentString);
infowindow.open(map,marker);
});
bounds.extend(marker.position);
}
function callajax(){
downloadUrl('xml1.xml',function (listings_data){
listings_data = xmlParse(listings_data);
var markers = listings_data.documentElement.getElementsByTagName('listing');
for (var i = 0; i < markers.length; i++)
{
var web;
var storename= markers[i].getElementsByTagName('storename')[0].firstChild.data;
addresses[i]= storename + " <br />" + markers[i].getElementsByTagName('address')[0].firstChild.data;
var perosn= markers[i].getElementsByTagName('person')[0].firstChild.data;
var phone= markers[i].getElementsByTagName('phone')[0].firstChild.data;
var source=markers[i].getElementsByTagName('source')[0].firstChild.data;
if (typeof markers[i].getElementsByTagName('web')[0] == "undefined")
web='';
else
web=markers[i].getElementsByTagName('web')[0].firstChild.data;
info[i]= perosn + " <br />"+ phone + " <br />"+ web +" <br />"+ source;
}});
}
var nextAddress = 0;
function theNext() {
if (nextAddress < addresses.length) {
setTimeout('getAddress("'+addresses[nextAddress]+'","'+info[nextAddress]+'",theNext)',1 );
nextAddress++;
} else {
map.fitBounds(bounds);
}
}
function timeout_init() {
setTimeout('theNext()', 3000);
}
callajax();
timeout_init();
</script>