gmaps4rails顯示隱藏功能

Question

我希望對gmaps4rails中的顯示/隱藏功能有一點了解。

example functionality

// == shows all markers of a particular category, and ensures the checkbox is checked == 
    function show(category) { 
    for (var i=0; i<gmarkers.length; i++) { 
     if (gmarkers[i].mycategory == category) { 
     gmarkers[i].setVisible(true); 
     } 
    } 
    // == check the checkbox == 
    document.getElementById(category+"box").checked = true; 
    } 

    // == hides all markers of a particular category, and ensures the checkbox is cleared == 
    function hide(category) { 
    for (var i=0; i<gmarkers.length; i++) { 
     if (gmarkers[i].mycategory == category) { 
     gmarkers[i].setVisible(false); 
     } 
    } 
    // == clear the checkbox == 
    document.getElementById(category+"box").checked = false; 
    // == close the info window, in case its open on a marker that we just hid 
    infowindow.close(); 
    } 

    // == a checkbox has been clicked == 
    function boxclick(box,category) { 
    if (box.checked) { 
     show(category); 
    } else { 
     hide(category); 
    } 
    // == rebuild the side bar 
    makeSidebar(); 
    } 

    function myclick(i) { 
    google.maps.event.trigger(gmarkers[i],"click"); 
    } 


    // == rebuilds the sidebar to match the markers currently displayed == 
    function makeSidebar() { 
    var html = ""; 
    for (var i=0; i<gmarkers.length; i++) { 
     if (gmarkers[i].getVisible()) { 
     html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + '<\/a><br>'; 
     } 
    } 
    document.getElementById("side_bar").innerHTML = html; 
    } 

所以，在我的控制，我建立標記列表，幷包括其類別爲JSON。

@markersLoc = @locSearch.to_gmaps4rails do |loc, marker| 
    letter.next! 
    marker_image = "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=#{letter}|82ABDD|000000" 
    marker.infowindow render_to_string(partial: '/events/info', 
            locals: {object: loc}) 
    marker.picture({picture: marker_image, 
        width: 32, 
        height: 32, 
        marker_anchor: [11,30], 
        shadow_picture: "http://chart.apis.google.com/chart?chst=d_map_pin_shadow", 
        shadow_width: 110, 
        shadow_height: 110, 
        shadow_anchor: [12,34]}) 
    marker.title loc.what 
    marker.sidebar render_to_string(partial: '/events/sidebar', 
            locals: {object: loc, letter: marker_image}) 
    marker.json({cat: loc.category}) 
end 

我有點卡住了，在這裏。我知道:cat字符串是可用的（例如：1,3,4），但我不知道如何使用它來實現我所追求的。

Answer 1

幾乎可以使用那裏有什麼，並進行了一些修改。這給了我9個類別的功能（可以更多或更少），並只查看我想要的。真棒。

// == shows all markers of a particular category, and ensures the checkbox is checked == 
function show(category) { 
    var regEx = new RegExp("[" + category + "]") 
    for (var i=0; i<Gmaps.map.markers.length; i++) { 
    if (Gmaps.map.markers[i].cat) { 
     if (Gmaps.map.markers[i].cat.match(regEx)) { 
     Gmaps.map.showMarker(Gmaps.map.markers[i]); 
     } 
    } 
    } 
    // == check the checkbox == 
    document.getElementById(category+"box").checked = true; 
} 

// == hides all markers of a particular category, and ensures the checkbox is cleared == 
function hide(category) { 
    var regEx = new RegExp("[" + category + "]") 
    for (var i=0; i<Gmaps.map.markers.length; i++) { 
    if (Gmaps.map.markers[i].cat) { 
     if (Gmaps.map.markers[i].cat.match(regEx)) { 
     Gmaps.map.hideMarker(Gmaps.map.markers[i]); 
     } 
    } 
    } 
    // == clear the checkbox == 
    document.getElementById(category+"box").checked = false; 
    // == close the info window, in case its open on a marker that we just hid 
    // Gmaps.map.infowindow.close(); 
} 

// == a checkbox has been clicked == 
function boxclick(box,category) { 
    if (box.checked) { 
    show(category); 
    } else { 
    hide(category); 
    } 
}