jQuery gMap具有大量动态位置 [英] jquery gMap with lots of dynamic locations

问题描述

好，所以我正在使用 gmap 从存储城市的xml文件中显示很多位置，状态，html以及有关某些位置的其他信息.问题出在这里的位置很可能超过100个.

Ok, so I'm using gmap to display many locatons from an xml file that stores the city, state, html, and other information about certain locations.Problem here is there are most likely over 100 locations.

在NEW我的ajax调用中:

Inside NEW my ajax Call:

    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中使用了.

Problem with this is it loads each time, firefox hates it and go figure, it works in IE7.

我的问题是，动态设置多个标记的最佳方法是什么? 这是新的工作代码:

My question is, what is the best way to dynamically set multiple markers? HERE IS THE NEW WORKING CODE:

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});   
                    });

推荐答案

我认为您应该像创建一样尝试创建JSON对象，并在完成后同时创建每个标记. (我不确定是否应该使用String，但是您知道了).

I think you should try to create the JSON objects like you do and once done create every markers at the same time. (I'm not certain if it's a String you should use, but you got the idea).

// With something like :
var myMarkers = "";
// 'Each' loop {
 myMarkers += "{ address: "+locAddress+", html: "+HTMLString+"},";
// End 'Each' loop }
// Don't forget to remove the trailing ','
 $("#map").gMap({ markers: [myMarkers] });

这篇关于jQuery gMap具有大量动态位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！