скрыть / просмотреть группу маркеров с помощью gomap-плагина - PullRequest
Новая
       2

скрыть / просмотреть группу маркеров с помощью gomap-плагина

2 голосов
/ 08 февраля 2012

Мне нравится скрывать / просматривать группу маркеров на карте с помощью плагина gomap (), как здесь: http://www.pittss.lv/jquery/gomap/solutions/group.html

на данный момент я понял это с помощью скрытия / просмотра только одного маркера: 

$(function() { 
    $("#map_canvas").goMap({
        latitude: 46.839, 
        longitude: 9.285, 
        zoom: 15 ,
        scaleControl: true,
        maptype: 'ROADMAP',
        markers: [{  
            latitude: 46.839, 
            longitude: 9.285,  
            id: 'biketour1', 
            group: 'bike',
            icon: 'pic/Kategorien/icon_bike.png', 
            html: { 
                content: 'Das ist die Biketour1', 
                popup:false
            }
        },{ 
            ...
            } 
        }], 
    }); 
    });

$("#bike-check").click(function() {  
        $.goMap.showHideMarker('bike');  
    });

Можете ли вы объяснить, как я могу реализовать скрытие / просмотр для группы?Я уже пробовал это с классом, но это не работает ...


обновление: 

$(".parentcheck").click(function() { 
var group = $(this).attr("id");

switch (group) {
    case "bike-check":
        showhidemarker("bike");
    break;
    case "event-check":
        //and so on
    break;
}
});



/*! show / hiding markergroup
    *
    * @ groupid Group id string
    * @ true  Optional boolean to set the visibility to a specific value. If omitted, markers will toggle.
*/
function showhidemarker(groupid){
    for (var i in $.goMap.markers) {
        $.goMap.showHideMarker($.goMap.markers[i], false); 
        console.log("it works");
    }
    $.goMap.showHideMarkerByGroup(groupid, true);
}

здесь HTML (нажав на флажокмаркеры должны быть видны или нет) 

...
    <ul>
      <li class="checkbox">
          <input id="bike-check" class="parentcheck" name="parentcheck" type="checkbox" checked="checked" value="Bike" />
          <p>Bike</p>
      </li>
      <li class="checkbox">
           <input id="event-check" class="parentcheck" type="checkbox" checked="checked" value="Events" />
           <p>Events</p>
       </li>
   </ul>
...

проблема в том, что этот метод: $ .goMap.showHideMarkerByGroup (groupid, true);не работает должным образом.

Маркер события исчезает, если щелкнуть флажок для велосипеда, но при нажатии на флажок велосипеда маркер с велосипеда должен исчезнуть!

Что не так?

Ответы [ 3 ]

3 голосов
/ 13 февраля 2012

понял:) 

var categories = {
        "bike-check": { 
            "groupID": "bike", 
            "isVisible": true
        },
        "event-check": {
            "groupID": "event", 
            "isVisible": true
        }
    };

$(".parentcheck").click(function() { 

    var id = $(this).attr("id");

    categories[ id ].isVisible = !categories[ id ].isVisible;
    showhidemarker( categories[ id ].groupID,categories[ id ].isVisible  );

});
function showhidemarker(groupid,show){
    $.goMap.showHideMarkerByGroup(groupid, show)
}
2 голосов
/ 10 ноября 2013

Если вы используете флажки для отображения / скрытия групп, вы можете сделать это следующим образом (при условии, что флажок имеет идентификатор «NFLCheckbox» и здесь имя группы «NFLGroup»): 

$("#NFLCheckbox").click(function () {
    if ($('#NFLCheckbox').is(':checked')) {
        $.goMap.showHideMarkerByGroup('NFLGroup', true)
    } else {
        $.goMap.showHideMarkerByGroup('NFLGroup', false)
    }
});

Подробнее об этом я написал здесь: http://www.codeproject.com/Articles/690045/How-to-Display-and-Hide-Marker-Groups-in-Google-Ma

2 голосов
/ 08 мая 2012

Намного проще скрыть все и показать только те, которые вам нужны ... пример из примеров GoMap 

for (var i in $.goMap.markers) {
    $.goMap.showHideMarker($.goMap.markers[i], false);
}
$.goMap.showHideMarkerByGroup(group, true);
...