Question

所以，我一直在努力确定如何解决这个问题已经有一段时间了。我有一个地图点列表，它们随着团队的每次更新而动态添加。 JSFIDDLE

以下是每个更新的示例：

mapPoints.push(new google.maps.LatLng(33.730362 , -85.792725));
        names.push("Alpha");
        times.push("1425059747829");
        colors.push("Red");

        mapPoints.push(new google.maps.LatLng(33.7304572 , -85.792498));
        names.push("Alpha");
        times.push("1425059747829");
        colors.push("Red");

        mapPoints.push(new google.maps.LatLng(33.7304346 , -85.792634));
        names.push("Alpha");
        times.push("1425059747829");
        colors.push("Red");

        mapPoints.push(new google.maps.LatLng(33.73041 , -85.79264));
        names.push("Alpha");
        times.push("1425059172108");
        colors.push("Blue");

        mapPoints.push(new google.maps.LatLng(33.730312 , -85.792654));
        names.push("Delta");
        times.push("1425059747723");
        colors.push("Blue");



        mapPoints.push(new google.maps.LatLng(33.73023 , -85.79246));
        names.push("Foxtrot");
        times.push("1425059172145");
        colors.push("Purple");


        mapPoints.push(new google.maps.LatLng(33.72476 , -85.788185));
        names.push("Golf");
        times.push("1425050587395");
        colors.push("Green");

根据这些信息，我将每个mapPoint传递到谷歌地图标记，并根据它们的名称对它们进行标记。然后，我根据给定的小队名称更新动态复选框，删除重复项。现在，每当我尝试切换与小队名称相关联的所有点的可见性时，它只会移除一个点而不是所有点。任何帮助将非常感谢！

function updateCheckbox(names,markers){

var checkbox = $("#checkBoxes");

//check if names return null if names !=null create a dynamic list of  checkboxes
//based on live squads


if(names!=null){
var $ctrl = $('<input/>').attr({type:'checkbox', checked:'yes',name:'chk'});
$("#checkBoxes").append($ctrl);


//designate squad name to each checkbox
$ctrl.after(names);
console.log(names);
 // toggle display of the squads


 }


 $($ctrl).click(function () {
if (this.checked) {
    if (markers) {
        for (var i=0; i<markers.length;i++) {
            if(markers[i].labelContent==markers){
          markers.setVisible(true);
      }
        }
    }
} else {
    if (markers) {
        for (var i=0; i<markers.length;i++) {
            if(markers[i].labelContent==markers){
          markers.setVisible(false);

         }
                }
              }
           }
      });

       }

Answer 1

您删除了重复项，因此它们与复选框无关。在单击复选框时对标记进行分组并循环显示它们将隐藏或全部显示它们：

var squads = {};
//create a hash of squads
for (var i = 0; i < names.length; i++) {
    if (squads[names[i]] === undefined) {
        squads[names[i]] = {markers: [markers[i]]};
    } else {
        squads[names[i]].markers.push(markers[i]);
    }
}
for (squad in squads) {
    updateCheckbox(squad, squads[squad].markers);
}
...
$($ctrl).click(function () {
    for (var i = 0; i < markers.length; i++) {
        markers[i].setVisible(this.checked);
    }
});

Updated fiddle here.

无法使用复选框

1 个答案: