わかりましたので、gmapを使用して、都市、州、html、および特定の場所に関するその他の情報を格納する xml ファイルから多くの場所を表示しています。
新しい私の ajax 呼び出しの内部:
var myMarkers = new Array;
$(xml).find("location").each(function(){
var locAddress = $(this).find("city").text() + "," + $(this).find("state").text() ;
var cc = $(this).find("cc").text();
var bcc;
if ($(this).find("bcc")){
bcc = $(this).find("bcc").text();
}else{
bcc = " - ";
}
var vendor =$(this).find("vendor").text();
var hours = $(this).find("hours").text();
var HTMLString = "<div class=\"map-balloon\"><h3>" + locAddress + "</h3>Vendor: " + vendor + "<br />CC#: " + cc + "<br />Bulk CC#: " + bcc + "<br />Hours: " + hours + "</div>" ;
myMarkers.push("{ address: \"" + locAddress + "\", html: \"" + HTMLString + "\"}");
});
$("#map").gMap({ markers: [myMarkers.toString()], address: "United States", zoom: 4 }); // shows the correct zoom and region, but markers do not display now.
console.log(myMarkers.toString());//Shows the correct string we want
これの問題は、毎回ロードされることです.firefoxはそれを嫌い、IE7で動作します.
私の質問は、複数のマーカーを動的に設定する最良の方法は何ですか? 新しい作業コードは次のとおりです。
var myMarkers = new Array;
$.ajax({
url: "tire-banks.xml",
dataType: ($.browser.msie) ? "text" : "xml",
async: false,
success: function(data){
var xml;
if (typeof data == "string") {
xml = new ActiveXObject("Microsoft.XMLDOM");
// xml.async = false;
xml.loadXML(data);
} else {
xml = data;
}
$(xml).find("location").each(function(){
var locAddress = $(this).find("city").text() + "," + $(this).find("state").text() ;
var cc = $(this).find("cc").text();
var bcc;
if ($(this).find("bcc")){
bcc = $(this).find("bcc").text();
}else{
bcc = " - ";
}
var vendor =$(this).find("vendor").text();
var hours = $(this).find("hours").text();
var HTMLString = "<div><h3>" + locAddress + "</h3>Vendor: " + vendor + "<br />CC#: " + cc + "<br />Bulk CC#: " + bcc + "<br />Hours: " + hours + "</div>" ;
myMarkers.push({ address: locAddress, html: HTMLString});
});