javascript - 循环遍历数组以获取 map

Question

我需要帮助循环遍历数组并完成此代码。我的数组是从 XML 文件创建的。 XML 文件包含要在 map 上绘制的 session 位置数据。数组最终看起来像这样:

markerfilter[0].name
markerfilter[0].address
markerfilter[0].Meeting_Type
etc...
markerfilter[1].name
markerfilter[1].address
markerfilter[1].Meeting_Type
etc...

现在所有标记都绘制在 map 上。我需要循环遍历数组并根据我设置的一些变量对其进行过滤。这是我循环遍历数组的尝试:

for (var i = 0; i < markerfilter.length; i++) {
    if (markerfilter[i].Meeting_Type==type&&markerfilter[i].Day_of_Meeting==day&&markerfilter[i].Time_of_Meeting==time){
        //need to plot the points on the map here
        }else{
        //need to show blank map
        }
    }

这是我的整个代码。我什至不知道循环是否位于正确的位置，或者其他代码片段是否需要进入循环内部。有什么帮助吗？？

$(document).ready(function() {
    $("#map").css({
    height: 500,
    width: 600
});
var myLatLng = new google.maps.LatLng(43.653823, -79.382843);
MYMAP.init('#map', myLatLng, 11);

$("#showmarkers").click(function(e){
    MYMAP.placeMarkers('include/xml.php');
});
});

var MYMAP = {
map: null,
bounds: null
}

MYMAP.init = function(selector, latLng, zoom) {
var myOptions = {
    zoom:zoom,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map($(selector)[0], myOptions);
this.bounds = new google.maps.LatLngBounds();
}

var markerfilter = [];
MYMAP.placeMarkers = function(filename) {
$.get(filename, function(xml){
    $(xml).find("marker").each(function(){
        var name = $(this).find('name').text();
        var address = $(this).find('address').text();
        var address2 = $(this).find('address2').text();
        var Meeting_Type = $(this).find('Meeting_Type').text();
        var Time_of_Meeting = $(this).find('Time_of_Meeting').text();
        var Day_of_Meeting = $(this).find('Day_of_Meeting').text();
        var Open_Meeting = $(this).find('Open_Meeting').text();
        var Wheelchair = $(this).find('Wheelchair').text();
        var ASL = $(this).find('ASL').text();
        var Comments = $(this).find('Comments').text();
        // create a new LatLng point for the marker
        var lat = $(this).find('lat').text();
        var lng = $(this).find('lng').text();
        var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));

        var markerdata = {};
        $(this).children().each(function() {
            markerdata[this.tagName] = $(this).text();
        });
        markerfilter.push(markerdata);

        var MeetingType = document.getElementById("Meeting_Type");
        var type = MeetingType.options[MeetingType.selectedIndex].text;
        var DayofMeeting = document.getElementById("Day_of_Meeting");
        var day = DayofMeeting.options[DayofMeeting.selectedIndex].text;
        var TimeofMeeting = document.getElementById("Time_of_Meeting");
        var time = TimeofMeeting.options[TimeofMeeting.selectedIndex].text;

        for (var i = 0; i < markerfilter.length; i++) {
        if (markerfilter[i].Meeting_Type==type&&markerfilter[i].Day_of_Meeting==day&&markerfilter[i].Time_of_Meeting==time){
            markerfilter[i].setMap(MYMAP.map);
            }else{
            markerfilter[i].setMap(null);
            }
        }

        // extend the bounds to include the new point
        MYMAP.bounds.extend(point);

        var marker = new google.maps.Marker({
            position: point,
            map: MYMAP.map
        });

        var infoWindow = new google.maps.InfoWindow();
        var html='<b><u>'+name+'</b></u><br />'+address2+'<br />'+address+'<br />'+Meeting_Type+',&nbsp'+Time_of_Meeting+',&nbsp'+Day_of_Meeting+'<br />Open Meeting:&nbsp'+Open_Meeting+'<br />Wheelchair Accessible:&nbsp'+Wheelchair+'<br />ASL:&nbsp'+ASL+'<br />Comments:&nbsp'+Comments;
        google.maps.event.addListener(marker, 'click', function() {
            infoWindow.setContent(html);
            infoWindow.open(MYMAP.map, marker);
        });
        MYMAP.map.fitBounds(MYMAP.bounds);
    });
});
console.log(markerfilter);
}

现在，当我运行电流时，firebug 告诉我:markerfilter[i].setMap(null) 不是一个函数。

Answer 1

关于错误:ma​​rkerfilter[i].setMap(null) 不是函数，我想我看到了你的问题。在 MYMAP.placemarkers 函数中，您创建 markerdata 对象，定义某种分配了文本值的 tagName 属性，然后推送markerdata 到:he markerfilter 数组:

var markerdata = {};
$(this).children().each(function() {
    markerdata[this.tagName] = $(this).text();
});
markerfilter.push(markerdata);

大约 10 行后，您将看到一个 for 循环，它尝试从 markerfilter 数组中检索代码预期的标记:

for (var i = 0; i < markerfilter.length; i++) {
    if ( markerfilter[i].Meeting_Type==type && 
            markerfilter[i].Day_of_Meeting==day && 
            markerfilter[i].Time_of_Meeting==time ) {

        markerfilter[i].setMap( MYMAP.map );
    }
    else {
        markerfilter[i].setMap( null );
    }
}

由于 markerfilter 数组已加载 markerdata，因此它不包含标记，因此 markerfilter[i].setMap(null ) 不是函数，因为 markerfilter[i] 不是标记。希望这有帮助 -