用 jquery 过滤谷歌地图数组答案

【问题标题】：Filter google maps array with jquery用 jquery 过滤谷歌地图数组
【发布时间】：2013-07-27 18:03:02
【问题描述】：

我想用 jQuery 滑块实现一个过滤器，但我真的不知道该怎么做。该应用程序在谷歌地图中显示了一些带有西班牙剧院信息的标记。剧院数组是用数据库中的 php 加载的。

var auditorios = [['Baluarte','Pamplona',42.81362217617467,-1.6468226909637451,'/index.php?id=1','1500','400','1.2','02_baluarte.jpg','1'],['Teatre Nacional de Catalunya','Barcelona',41.42171161401106,2.179288100000008,'/index.php?id=2','2000','500','1.8','teatre_nacional_de_catalunya.jpg','2'], ['Auditorio Nacional de Música','Madrid',40.44604831353722,-3.678132900000037,'/index.php?id=3','2000','600','1.9','auditorio_nacional_musica_madrid.jpg','3'],];

我使用“for”获取所有参数，以便调用引导模式

function setMarkers(map, locations) {

    for (var i = 0; i < locations.length; i++) {
    var auditorio = locations[i];
    var posicionauditorio = new google.maps.LatLng(auditorio[2], auditorio[3]);
    var marker = new google.maps.Marker({
      position: posicionauditorio,
      animation: google.maps.Animation.DROP,
      map: map,
      title:auditorio[0],
      ciudad:auditorio[1],
      href:auditorio[4],
      capacidad:auditorio[5],//localidades del auditorio
      volumen:auditorio[6],//volumen del auditorio
      trmid:auditorio[7],//TRmid del auditorio
      foto:auditorio[8],
      idauditorio:auditorio[9]
      //icon:pin
    });

    google.maps.event.addListener(marker, "click", function () {

        $('#myModalLabel').html(this.title);//Seleecionar el título del auditorio actual
        $('#localizacion').html('<i class="icon-map-marker"></i> '+this.ciudad);
        $('.capacidad').html(this.capacidad + ' localidades');//Seleccionar el contenido HTML del auditorio actual
        $('.volumen').html(this.volumen + ' m3');
        $('.trmid').html(this.trmid + ' seg.');
        $('#mas-info-auditorio').attr('href',this.href);
        $('#fotoauditorio').attr('src','archivos/auditorios/'+this.idauditorio+'/'+this.foto);
        $('#myModal').modal('toggle');
    });
    }
    //Fin setMarkers
    }

我想用一些滑块过滤“capacidad:auditorio[5]”、“volumen:auditorio[6]”和“trmid:auditorio[7]”，但我不知道该怎么做。

这里是这个应用程序的链接：map application

【问题讨论】：

标签： php jquery google-maps filter jquery-ui-slider

【解决方案1】：

将标记存储在全局可访问数组中，您可以在滑动回调中迭代标记并通过将滑块值与标记属性值进行比较来设置它们的可见性。

volumen-slider 示例（假设一个名为 markers 的全局可访问数组包含所有标记）：

$.each(markers,function(i,o){
   o.setVisible(ui.values[0]<=o.volumen && ui.values[1]>=o.volumen);
});

【讨论】：